네트워크12 네트워크 Browser 요청의 제한🌱 (HTTP/1.1, HTTP/2) HTTP/1.0, HTTP/1.1 프로토콜을 이용할때는 브라우저에서 동시에 요청을 보내는 개수에 제한이 있습니다. 그래서 HTTP/1.0, HTTP/1.1 프로토콜을 이용할때는 외부 resource를 요청할때 예상치 못한 delay를 경험할 수 도 있습니다. css, js일 경우에는 inline으로 변경을 하거나 npm을 이용하거나 webpack과 code split을 적절히 이용, http/2 프로토콜로 변경, 브라우저 요청 제한은 한 도메인에만 해당하므로 여러 도메인에서의 요청으로 변경하면 이를 해결할 수 있습니다. * http/2는 nginx에 http2 모듈을 설치하면 적용할 수 있습니다. 아래의 글은 http/1.1을 이용할 때 브라우저에서의 요청 제한에 대해 알아보고 그 외에 의식의 흐름대로 .. 2022. 4. 21. 네트워크 JWT 🗝 JWT(Json Web Token)에 대해 알아보려 합니다. 이 글에서는 공식문서의 내용을 기반으로 제 경험을 섞을 것입니다. JWT란? JSON Web Token은 JSON 객체로 정보를 안전하게 전송하는 자체적인 방법을 정의한 표준입니다. 이 정보들은 디지털 서명이 되어있으므로 신뢰할 수 있습니다. 비밀키나 RSA 혹은 ECDSA를 사용한 공개/개인키를 사용하여 JWT는 서명되어 질수 있습니다. JWT를 사용하는 경우? 인증 : JWT를 쓰는 가장 흔한 경우입니다. 사용자가 로그인을 하면 이후의 연속된 요청들은 JWT를 포함하게 되고(헤더에 포함됨), user에게 routing, service 이용, 자원에 대한 접근을 허용합니다. jwt는 작은 overhead를 유발하고 다른 도메인간에 쉽게 사용될.. 2022. 4. 19. 주소창에 www.google.com을 입력하면?(성공과 실패를 결정하는 1% 네트워크 원리) 간단하게 정리한 질문에 대한 답변 1. 유저가 브라우저에서 www.google.com을 입력하면 먼저 브라우저에서 HTTP request message를 생성합니다. 2. 이후 DNS lookup을 통해 보내야 하는 서버 주소 ip를 알아 옵니다. 3. HTTP 메시지를 TCP/IP층에 전달합니다. - TCP/IP 층에서는 HTTP 요청메시지에 자신들의 헤더를 추가하여 패킷을 생성합니다. - TCP층에서는 상대방의 포트, 나의 포트가 추가되고, TCP 연결을 위한 flag등이 헤더에 추가되고 - IP층에서는 상대방의 ip 주소, mac주소 등이 추가가 됩니다. 4. 패킷은 전기신호로 변환되어 랜선을 통해 라우터들을 거쳐 목적지 ip에 전달되게 됩니다. 5. 목적지 서버에서는 전달받은 패킷을 생성한 과정과.. 2022. 4. 17. 네트워크 HTTP, HTTPS, SSL HandShake 😶🌫️ HTTP HTTP(Hyper Text Transfer Protocol)은 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜 입니다. 웹 브라우저와 웹 서버간의 통신을 위해 디자인 되었습니다. HTTP 요청이 발생하면 브라우저는 HTTP 요청 메시지를 생성하고 TCP/IP 프로토콜을 이용하여 웹 서버에 요청을 전달합니다. 이후 브라우저는 웹 서버로부터 HTTP 응답을 전달 받습니다. HTTP요청 메시지는 크게 startline, 헤더와 바디로 구성되고 startline에는 메소드, 경로, 프로토콜의 버전이 추가됩니다. 헤더에는 요청에 설정한 HTTP 헤더들이 들어갑니다. 바디에는 POST 요청일 경우에 추가되고 다른 메서드의 경우에는 추가되지 않습니다. HTTP 응답 메시지에는 크게 sta.. 2022. 4. 17. 네트워크 HTTP, HTTP 1.1, HTTP 2.0 🔥 HTTP HTTP(Hyper Text Transfer Protocol)은 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜 입니다. 웹 브라우저와 웹 서버간의 통신을 위해 디자인 되었습니다. HTTP 요청이 발생하면 브라우저는 HTTP 요청 메시지를 생성하고 TCP/IP 프로토콜을 이용하여 웹 서버에 요청을 전달합니다. 이후 브라우저는 웹 서버로부터 HTTP 응답을 전달 받습니다. HTTP요청 메시지는 크게 startline, 헤더와 바디로 구성되고 startline에는 메소드, 경로, 프로토콜의 버전이 추가됩니다. 헤더에는 요청에 설정한 HTTP 헤더들이 들어갑니다. 바디에는 POST 요청일 경우에 추가되고 다른 메서드의 경우에는 추가되지 않습니다. HTTP 응답 메시지에는 크게 sta.. 2022. 4. 16. html5, 웹 표준 및 웹 접근성 🔥 HTML5에서 추가된 내용 html 5에서는 doctype의 선언이 변경되었습니다. 기존에는 html의 태그가 그려지는 명세를 브라우저에게 알려주기 위해 doctype 뒤에 많은 것들이 추가되었으나 html5에서는 으로 html 태그 위에 추가해주어 선언해줄 수 있습니다. 이 태그를 추가해주지 않으면 호환 모드로 렌더링이 되어 화면에 다르게 보여질수가 있습니다. 플래시 없이 비디오 및 오디오 기능을 자체적으로 지원합니다. 애플에서 html5를 safari에서 지원하면서 플래시를 safari에서 지원하지 않기로 했을때 잡음이 심했습니다. 서버와의 소켓 통신을 지원하므로 서버와 양뱡향 통신이 가능해 졌습니다. 시맨틱 태그를 지원하기 위한 태그를 예를 들면 button, main, header, section.. 2022. 4. 13. 이전 1 2 다음