브라우저에서 서버로부터 응답을 받는 과정

개발을 하다 보면 API요청을 하는 일이 많이 있는데요. 브라우저에서 API 요청을 하고 서버로부터 응답을 받기 까지는 어떠한 과정을 거치게 될까요? 1. 사용자가 입력한 URL을 분석 URL(Uniform Resource Locator)은 인터넷에서 자원의 위치(주소)를 나타냅니다. 그리고 URL은 프로토콜, 도메인네임, 포트, 경로, 파라미터 등으로 구성됩니다. 만약 이 URL 문법에 맞지 않는다면, 기본 검색엔진으로 검색을 요청합니다. 2. URL을 IP 주소로 변환(DNS 조회) URL에는 도메인네임이 들어갑니다. 이 도메인네임을 DNS(Domain Name System) 서버에 요청하여 컴퓨터가 읽을 수 있는 IP 주소로 변환합니다. IP 주소를 바로 입력해도 됩니다만, IP 주소는 기억하기 어렵습니다 (도메인을 돈 주고 사는 이유) 3. 대상 서버와 TCP 소켓 연결 TCP 소켓 연결은 3 way handshake라는 과정을 통해 이루어집니다. - 1단계 SYN (synchronize sequence numbers 동기 시퀀스 넘버): 연결 요청 메시지 전송 - 2단계 SYN + ACK(Acknowledgement 답신): SYN 요청에 대해 서버에서 응답을 합니다.(수락 혹은 거절) - 3단계(ACK): 서버로부터의 응답을 확인하고 데이터전송을 시작할 안정적인 연결을 설정합니다. 참고로 HTTP3에서는 TCP의 3 way handshake를 없애고자 TCP가 아닌 UDP를 사용합니다. 4. 요청, 응답 및 브라우저 렌더링 드디어 연결이 확정되었습니다. 해당 페이지를 서버에 요청하고 서버는 이 요청에 대한 응답을 브라우저에게 전달합니다. HTML, CSS, JavaScript를 전달받은 브라우저는 구문 분석을 통해 파싱 -> 렌더링 트리 구성 -> 렌더링 트리 배치(레이아웃) -> 페인팅 등의 과정을 통해 사용자에게 화면을 보여줍니다. API 요청 시 브라우저에서 서버로부터의 응답을 아주 간략하게 4가지로 요약해 보았는데요. 실제로는, HTTP, HTTPS로 보낼지 판단하는 HSTS 목록 조회, 논리적 주소인 IP를 물리적 주소(MAC)으로 변경하는 ARP(Address Resolution Protocol)의 과정 등이 더 있습니다. 네트워크 지식은 모든 개발자에게 필요한 지식이기에 여유가 되신다면 틈틈이 공부하시는 것을 추천드립니다.

다음 내용이 궁금하다면?

또는

이미 회원이신가요?

2023년 1월 6일 오전 12:56

 • 

저장 373조회 7,253

댓글 0

    함께 읽은 게시물

    부족함에 대한 태도

    직장에서 다른 사람을 힘들게 하는 유형에도 여러 가지가 있는데, 그중 하나가 바로 완벽주의자다. 물론, 완벽을 추구하는 것이 나쁜 것은 아니다. 오히려 권장되기도 한다. 문제는 부족함을 대하는 태도에서 나온다. 완벽에 너무 집착한 나머지 부족함을 용납하지 못하는 정도가 되면 주변 사람들이 힘들어진다.

    ... 더 보기

    Next.js 프로젝트를 AWS EKS에 배포하며 배운 것들

    ... 더 보기

    쿠버네티스를 활용한 클라우드 네이티브 데브옵스 | 존 어런들 - 교보문고

    product.kyobobook.co.kr

    쿠버네티스를 활용한 클라우드 네이티브 데브옵스 | 존 어런들 - 교보문고

     • 

    저장 19 • 조회 1,710


    비개발자도 Cursor AI로 결제 가능한 웹 서비스 만들기 🚀

    6

    ... 더 보기

    비개발자도 Cursor AI로 결제 가능한 웹 서비스 만들기 🚀 (6차. 25.06.21, 25.06.28) - Learning by Doing

    Latpeed

    비개발자도 Cursor AI로 결제 가능한 웹 서비스 만들기 🚀 (6차. 25.06.21, 25.06.28) - Learning by Doing

    무너지고 있는 프론트엔드, 백엔드 직군의 경계에 대한 고찰

    AI 기술이 우리 일상과 산업 전반에 스며들면서 소프트웨어 개발 환경 역시 큰 변화의 물결을 맞이하고 있다. 특히 코딩을 돕는 AI 에이전트의 등장은 개발 생산성에 대한 큰 변화를 만들고 있다. 나 역시 이러한 변화를 체감하며, 나에게 익숙한 소프트웨어 개발의 대표적인 두 축인 프론트엔드와 백엔드 영역에서 AI 기술이 미치는 영향과 그로 인해 변화하는 소프트웨어 엔지니어의 역할에 대해 개인적인 생각을 정리해 본다.

    ... 더 보기

     • 

    저장 35 • 조회 4,659


    괴물은 하루아침에 태어나지 않는다

    큰 것을 하는 것보다 매일 작은 것을 완벽하게 해내는 노력이 더 중요하다. 내가 성격 장애의 하나인 자기애성 성격장애자(NPD, Narcissistic Personality Disorder)를 만나면서 느낀 것은, 처음에는 그런 사람도 "정상인"처럼 느껴진다는 것이었다. 다만 그의 미친짓은 내가 매일매일 "사소한" 사건들로 상대방에게 익숙해졌을 때 발생한다.

    ... 더 보기

    하나부터 열까지 리더가 상세히 설명해 주기를 바라는 구성원이 있습니다. 반대로 큰 얼개만 듣고 나머지는 자율적으로 하고 싶어 하는 경우도 있죠. 회식에 참여하는 것을 너무나 힘겨워 하는 구성원이 있는 반면, 동료들과 함께 시간을 보내며 가까워지는 것을 원하는 구성원도 있습니다.

    ... 더 보기

    다양한 구성원을 하나로 모으고 싶다면 - 리더가 가져야 할 모순

    네이버 블로그 | HSG 휴먼솔루션그룹

    다양한 구성원을 하나로 모으고 싶다면 - 리더가 가져야 할 모순