ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [TIL] HTTP 기초
    Develope/Web 2020. 5. 14. 18:31

    1. HTTP 란

    ◎ HyperText Transfer Protocol의 약자로 HTML 문서를 교환하기 위해 만들어진 protocol(통신규약)이다.

    • 웹상에서 네트워크로 서버끼리 통신을 할 때 어떠한 형식으로 서로 통신을 하자고 규정해 놓은 통신규약이다.

    • 프론트엔드 서버와 클라이언트간의 통신에 사용된다.

    • 백엔드와 프론트엔드 서버간에의 통신에도 사용된다.

    • HTTP는 TCP/IP 기반으로 되어있다.

    2. HTTP 핵심요소

    2-1. HTTP 통신방식

    ● HTTP는 기본적으로 요청/응답 (request/response) 구조로 되어있다.

    • 클라이언트가 HTTP request를 서버에 보내면 서버는 HTTP response를 보내는 구조이다.

    • 클라이언트와 서버의 모든 통신이 요청과 응답으로 이루어진다.

     

    ● HTTP는 Stateless이다.

    • Stateless 란 말 그대로 state(상태)를 저장하지 않는다는 뜻이다.

    • 요청이 오면 그에 응답을 할 뿐, 여러 요청/응답끼리 연결되어 있지 않다는 뜻이다. 즉 각각의 요청/응답은 독립적인 요청/응답이다.

    • 여러 요청과 응답의 진행과정이나 데이터가 필요할 때는 쿠키나 세션 등을 사용하게 된다.

    ※ Stateless의 문제점 및 해결방안

    문제점: 예를 들어 한번 로그인을 했는데 로그인했다는 상태를 모른다. 요청을 보낸 사람이 요청을 보낼 때 받는 사람이 그에 대한 요청을 응답할 수 있게 모든 정보를 보내줘야 한다.

     

    해결방안: 쿠키나 세션으로 해결한다. 쿠키를 사용해서 사용자의 브라우저에 정보를 저장한다. (세션은 메모리에 저장. 쿠키는 파일에 저장) 하지만 보안이 중요한(금융 쪽) 사이트는 쿠키를 허가 안 해주는 곳도 있다.

    2-2. HTTP Request 구조

    ◎ HTTP request 메세지는 크게 세 개의 부분으로 구성된다.

    • Start Line

    • Headers

    • Body

     

    2-2-1. Start Line

     

    ◎ 말 그대로 HTTP request의 첫 라인이다. HTTP request의 start line 또한 세 가지로 구성되어 있다.

     

    ● HTTP Method

    • 해당 request가 의도한 action을 정의하는 부분이다.

    • HTTP Methods에는 GET, POST, PUT, DELETE, OPTIONS 등이 있다.

    • 주로 GETPOST가 쓰인다.

     

    ● Request target

    • 해당 request가 전송되는 목표

    • 예를 들어 /login, /search, /product

     

    ● HTTP Version

    • HTTP 버전을 나타낸다. 버전에는 1.0, 1.1, 2.0 등이 있다. (2.0이 나왔지만 보통 1.1을 많이 사용하고 있다)

    GET /search HTTP/1.1

    2-2-2. Headers

    ◎ 해당 request에 대한 추가 정보를 담고 있는 부분이다.

     

    Key:Value 값으로 되어있다 ( : 키워드 사용)

    • key:value

    • HOST: naver.com => Key = HOST, Value = naver.com

     

    ● 자주 사용되는 header 정보

    • Host : 요청이 전송되는 target의 host url: 예를 들어, naver.com , google.com

    • User-Agent : 요청을 보내는 클라이언트의 대한 정보(웹 브라우저에 대한 정보)

    • Accept : 해당 요청이 받을 수 있는 응답 타입.

    • Connection : 해당 요청이 끝난 후에 클라이언트와 서버가 계속해서 컨넥션을 유지할 것인지 아니면 끊을 것인지에 대해 지시하는 부분

    • Content-Type : 해당 요청이 보내는 메세지 body의 타입 (application/json)

    • Content-Length : 메세지 body의 길이

     

    Accept: */*
    Accept-Encoding: gzip, deflate
    Connection: keep-alive
    Content-Type: application/json
    Content-Length: 257
    Host: google.com
    User-Agent: HTTPie/0.9.3

    2-2-3. Body

    ◎ 해당 request의 실제 메세지/내용이 있다.

    Body가 없는 request도 많다.(예를 들어, GET request들은 대부분 body가 없는 경우가 많다.)

    POST /payment-sync HTTP/1.1
    
    Accept: application/json
    Accept-Encoding: gzip, deflate
    Connection: keep-alive
    Content-Length: 83
    Content-Type: application/json
    Host: intropython.com
    User-Agent: HTTPie/0.9.3
    
    {
        "imp_uid": "imp_1234567890",
        "merchant_uid": "order_id_8237352",
        "status": "paid"
    }

    2-3. HTTP Response 구조

    ◎ HTTP response도 세 가지로 구성되어 있다.

    • Status line

    • Headers

    • Body

    2-3-1. Status Line

    ◎ Response의 상태를 간략하게 나타내 주는 부분이다.

    • HTTP 버전

    • Status code: 응답 상태를 나타내는 코드이다. 숫자로 되어있는 코드이다. (200, 404 등)

    • Status text: 응답 상태를 간략하게 설명해주는 부분이다. ( "Not Found" )

    HTTP/1.1 404 Not Found

    2-3-2. Headers, Body

    ◎ Headers와 Body는 Request와 비슷해서 생략하겠다.

    HTTP/1.1 404 Not Found
    
    Connection: close
    Content-Length: 1573
    Content-Type: text/html; charset=UTF-8
    Date: Mon, 20 Aug 2018 07:59:05 GMT
    
    <!DOCTYPE html>
    <html lang=en>
      <meta charset=utf-8>
      <meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
      <title>Error 404 (Not Found)!!1</title>
      <style>
        *{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
      </style>
      <a href=//www.google.com/><span id=logo aria-label=Google></span></a>
      <p><b>404.</b> <ins>That’s an error.</ins>
      <p>The requested URL <code>/payment-sync</code> was not found on this server.  <ins>That’s all we know.</ins>

    3. 자주 쓰이는 HTTP Methods

    ● GET

    • 이름 그대로 어떠한 데이터를 서버로부터 받아올 때 주로 사용하는 Method이다.

    • 데이터 생성/수정/삭제 없이 단순히 받아오기만 할 때 사용된다.

    • 가장 간단하고 많이 사용되는 HTTP Method이다.

    • 위에서 배운 대로 주로 데이터를 받아올 때 사용되기 때문에 request에 body를 안 보내는 경우가 많다.

    POST

    • 데이터를 생성/수정/삭제할 때 주로 사용되는 Method이다.

    • 데이터를 생성 및 수정할 때 많이 사용하기 때문에 대부분의 경우 request body가 포함되서 보내진다.

    PUT

     

    • POST와 비슷하다. 데이터를 생성할 때 사용되는 Method이다.

    DELETE

    • 특정 데이터를 서버에서 삭제 요청을 보낼 때 쓰이는 Method이다.

    4. 자주 쓰이는 HTTP Status Code

    ● 200 OK

    • 가장 자주 보게 되는 status code이다

    • 문제없이 다 잘 실행되었을 때 보내는 코드이다.(그만큼 가장 기분 좋은 상태 코드!!)

    ● 301 Moved Permanently

    • 해당 URI가 다른 주소로 바뀌었을 때 보내는 코드

    HTTP/1.1 301 Moved Permanently
    Location: http://www.example.org/index.asp

    ● 400 Bad Request

    • 해당 요청이 잘못된 요청일 때 보내는 코드이다.

    • 주로 요청에 포함된 input 값들이 잘못된 값들이 보내졌을 때 사용되는 코드이다. (예를 들어, 전화번호를 보내야 되는데 text가 보내졌을 때 )

    401 Unauthorized

    • 유저가 해당 요청을 진행하려면 먼저 로그인을 해야 할 때, 회원가입을 해야 할 때 등 필요하다는 것을 나타내려 할 때 사용하는 코드이다.

    ● 403 Forbidden

    • 유저가 해당 요청에 대한 권한이 없다는 뜻이다.(예를 들어, 오직 과금을 한 유저만 볼 수 있는 데이터를 요청했을 때)

    ● 404 Not Found

    • 요청된 uri가 존재하지 않는다는 뜻이다.

    500 Internal Server Error

    • 서버에서 에러가 났을 때 사용하는 코드이다.

    • API 개발을 하는 백앤드 개발자들이 싫어하는 코드이다.

    'Develope > Web' 카테고리의 다른 글

    [TIL] Cookie vs LocalStorage vs SessionStorage  (0) 2020.07.28
    [TIL] 웹 동작 방식  (0) 2020.05.06
Designed by Tistory.