HTTP6 개발자도구 조금 더 잘쓰기( feat. network tab ) 웹 개발자의 필수도구인 F12 혹은 option + cmd + i 키를 누르면 나오는 개발자도구... 정말 잘 쓰는 사람은 드물다고 생각한다 일단 이번에는 network 탭에서의 간단한 정보들에 대한 것들을 포스팅하려고 한다 개발자도구 탭에서는 정말 여러가지 디버깅을 해볼 수 있는데, 이 중 network 탭을 살펴보자 저 위의 단축키를 눌러서 네트워크 탭을 들어가보자 보통 이런 화면을 볼 수 있을 것이다 여기에는 webserver가 내려준 정적 파일(css, ico, images)들과 http method 등 다양한 것들을 볼 수가 있는데, 프론트엔드 개발자의 주된 관심사는 Http method 호출이다(Application Programming Interface->api라고 흔히 부르는) 위의 Sub.. 2023. 9. 25. Mixed Content: Let's Encrypt! 등으로 Https를 적용 후 api요청을 http로 보내면 발생하는 브라우저 보안 에러이다 HTTS는 HTTP의 TCP/IP 통신에 SSL(Secure Socket Layer)를 한층 더 위에 얹은 것이다 공개키알고리즘으로 CA(인증 기관)과 암/복호화를 통해 본인인증이 맞는지 검증을 한다 브라우저 내의 자물쇠 모양을 클릭하면 알수있다 우선 이 Mixed Content에러는 https에서 http로 요청을 보낼때 발생한다 해결방법은 4가지가 있다 1. API 요청을 http://~~~ 가 아닌 https://~~~ 로 요청해서 처리하기 2. 페이지의 meta 태그에 내용 추가 -> 아래의 의미는 안전하지 않은 요청들을 https로 업그레이드 해서 요청하겠다는 뜻이다 1번은 하나.. 2022. 6. 27. Axios 사용법 후론트엔드 글은 잘 안쓰는데.... 쓰려고한닷[ 나는 ES6를 좋아한다 ] 일단 클라이언트단에서 HTTP통신을 하기 위한 방법에는 Ajax, Fetch, Axios 3대장이 있다 위에 나온것처럼 Axios가 지원 브라우저도 제일 많고, XSRF(CSRF) 보안도 갖추고 있으며, response가 JSON type이며, Promise기반이기때문에 Call back hell을 막을 수 있다. CDN 방식 npm install 방식 npm install axios 파일 직접 다운로드 * ajax의 문제점 // Ajax 깊어진 callback 형태 ⇒ 알아보기 어려움 // Axios 알아보기 쉬워진 가독성 * interceptor로 요청, 응답 custom하기 const validate = (stat) => {.. 2022. 3. 30. 그림으로 배우는 http&Network Basic (1) - 웹과 네트워크의 기본 제 1장 웹과 네트워크의 기본에 대해 알아보자 1.1 웹은 HTTP로 나타낸다 1.2 HTTP는 이렇게 태어났고 성장했다 1.2.1 웹은 지식 공유를 위해 고안되었다 1.2.2 웹이 성장한 시대 1.2.3 진보 안하는 HTTP 1.3 네트워크의 기본은 TCP/IP 1.3.1 TCP/IP는 프로토콜의 집합 1.3.2 계층으로 관리하는 TCP/IP 1.3.3 TCP/IP 통신의 흐름 1.4 HTTP와 관계가 깊은 프로토콜은 IP/TCP/DNS 1.4.1 배송을 담당하는 IP 1.4.2 신뢰성을 담당하는 TCP 1.5 이름 해결을 담당하는 DNS 1.6 이들과 HTTP와의 관계 1.7 URI와 URL 1.7.1 URI는 리소스 식별자 1.7.2 URL 포맷 1.1 웹은 HTTP로 나타낸다 클라이언트(Clien.. 2021. 7. 5. 그림으로 배우는 http&Network Basic (0) - 목차 & Why? 백엔드 개발자로서 간단하거나 깊은 http와 network에 대한 지식은 필수라고 생각한다. 그래서 나혼스(나 혼자하는 스터디)를 시작해보려고 한다. 왜? => 백엔드개발자로서 필수 역량을 갖추기 위해 목차 제 1장 웹과 네트워크의 기본에 대해 알아보자 1.1 웹은 HTTP로 나타낸다 1.2 HTTP는 이렇게 태어났고 성장했다 1.2.1 웹은 지식 공유를 위해 고안되었다 1.2.2 웹이 성장한 시대 1.2.3 진보 안하는 HTTP 1.3 네트워크의 기본은 TCP/IP 1.3.1 TCP/IP는 프로토콜의 집합 1.3.2 계층으로 관리하는 TCP/IP 1.3.3 TCP/IP 통신의 흐름 1.4 HTTP와 관계가 깊은 프로토콜은 IP/TCP/DNS 1.4.1 배송을 담당하는 IP 1.4.2 신뢰성을 담당하는 .. 2021. 6. 27. HTTP와 HTTPS 차이점 MDN Docs에서 검색을 해보면 - HTTP(Hyper Text Transfer Protocol) 하이퍼텍스트 전송 프로토콜(HTTP)은 HTML과 같은 하이퍼미디어 문서를 전송하기위한 애플리케이션 레이어 프로토콜입니다. 웹 브라우저와 웹 서버간의 커뮤니케이션을위해 디자인되었지만, 다른 목적으로도 사용될 수 있습니다. HTTP는 클라이언트가 요청을 생성하기 위한 연결을 연다음 응답을 받을때 까지 대기하는 전통적인 클라이언트-서버 모델을 따릅니다. HTTP는 무상태 프로토콜이며, 이는 서버가 두 요청간에 어떠한 데이터(상태)도 유지하지 않음을 의미합니다. 일반적으로 안정적인 전송 레이어로 UDP와 달리 메세지를 잃지 않는 프로토콜인 TCP/IP 레이어를 기반으로 사용 합니다. RUDP — 안정적인 업데이.. 2021. 6. 23. 이전 1 다음
