본문 바로가기

KnockOn

[1주차 TIL] KnockOn Bootcamp HTTP / HTTPS

728x90

HTTP


HTTP는 HyperText Transfer Protocol의 약자로 웹 상 클라이언트와 서버간 

하이퍼 텍스트 문서를 전송하기 위한 프로토콜이다 

HTML 문서, 이미지, 동영상, 스타일 시트 등 다양한 리소스를 전송할 수 있다

 

HTTP / HTTPS


HTTP와 HTTPS의 주요 차이점은 보안이다

HTTPS는 SSL , TLS, 또는 암호화를 추가하여 보안을 강화한 프로토콜이다

HTTPS는 보안이 강화된 장점이 있기에 대부분의 웹사이트에서 사용된다

 

HTTP 헤더, 바디의 구조


헤더(Header)의 종류

  1. 일반 헤더
    Cache-Control : 요청이나 응담의 캐싱 방식을 지정
    ex) Cache-Control: no-cache (캐시하지 않음)

    Connection : 네트워크 연결의 유지 여부를 지정
    ex) Connection: keep-alive (연결을 유지)

    Date : 메세지가 생성된 날짜와 시간을 나타냄
    ex) Date: Wed, 21 Oct 2015 07:28:00 GMT (요청 또는 응답 생성 시간)

    Via : 중간 프록시 서버의 정보를 나타냄
    ex) Via: 1.1 example.com (squid/3.1) (프록시 서버 정보)

  2. 요청 헤더
    Accept : 클라이언트가 받아들일 수 있는 미디어 타입을 지정
    ex) Accept: text/html (HTML 형식의 응답 허용)

    Accept-Encoding : 클라이언트가 받아들일 수 있는 인코딩 방식을 지정
    ex) Accept-Encoding: gzip, deflate (gzip 또는 deflate 인코딩 허용)

    Authorization : 클라이언트의 인증 정보를 포함
    ex) Authorization: Bearer <token> (Bearer 토큰을 사용한 인증)

    Host : 요청하는 서버의 도메인 이름과 포트 번호를 지정
    ex) Host: www.example.com (서버 도메인 이름)

    User-Agent : 요청을 보낸 클라이언트의 정보를 포함
    ex) User-Agent: Mozilla/5.0 (브라우저 정보)

    Referer : 요청을 보낸 페이지의 URL을 포함
    ex) Referer: https://www.google.com (참조 페이지 URL)

    Cookie : 클라이언트가 서버에 전송할 쿠키를 포함
    ex) Cookie: sessionId=abc123 (세션 쿠키)

  3. 응답 헤더 
    Content-Type : 응답 바디의 콘텐츠 유형을 지정
    ex) Content-Type: text/html (HTML 형식의 응답)

    Content-Length : 응답 바디의 길이를 바이트 단위로 지정
    ex) Content-Length: 138 (응답 바디의 길이)

    set-Cookie : 클라이언트에 설정할 쿠키를 지정
    ex) Set-Cookie: sessionId=abc123; Path=/; HttpOnly (세션 쿠키 설정)

    Server : 응답을 생성한 서버 소프트웨어의 정보를 포함함
    ex) Server: Apache/2.4.1 (Unix) (서버 소프트웨어 정보)

    Location : 리다이렉션할 URL을 지정
    ex) Location: https://www.example.com/newpage (리다이렉션 URL)

  4. 엔티티 헤더
    Content-Encoding : 응답 바디의 인코딩 방식을 지정
    ex) Content-Encoding: gzip (gzip으로 인코딩된 응답)

    Content-Language : 응답 바디의 언어를 지정
    ex) Content-Language: en-US (응답 바디의 언어)

    Content-Location : 원본 리소스의 위치를 지정
    ex) Content-Location: /index.html (원본 리소스 경로)

    Content-Disposition : 응답 바디의 표시 방식을 지정
    ex) Content-Disposition: attachment; filename="filename.jpg" (첨부 파일로 다운로드)

 

바디(Body)의 종류

  1. 요청 바디
    HTML Form Data : HTML 폼에서 전송되는 데이터이다
    ex) name=John+Doe&age=30 (폼 데이터)

    JSON : JSON 형식의 데이터
    ex) {"username": "john_doe", "password": "securepassword123"} (JSON 데이터)

    XML : XML 형식의 데이터
    ex) <user><username>john_doe</username><password>securepassword123</password>

    Plain Text : 일반 텍스트 데이터
    ex) This is plain text data. (일반 텍스트 데이터)
  2. 응답 바디HTML : HTML형식의 데이터ex) 
    <html>
            <head>  <title>Example</title>  </head>
            <body>  <h1>Hello, World!</h1>  </body>
    </html>

    JSON : JSON 형식의 데이터
    ex) {"message": "Hello, World!"} (JSON 데이터)

    XML : XML 형식의 데이터
    ex) <message>Hello, World!</message> (XML 데이터)

    Plain Text : 일반 텍스트 데이터
    ex) Hello, World! (일반 텍스트 데이터)

    이미지 : 이미지 데이터
    ex) (바이너리 데이터로 전송, image/jpeg, image/png 등)

 

HTTP method


HTTP 메서드는 클라이언트가 서버에 요청을 보낼 때 사용하는 방법을 정의한다

주요 HTTP 메서드

  1. GET : 서버에서 데이터를 조회할 때 사용한다
    데이터를 가져오는 요청이고 서버에 변경을 가하지 않는다
    ex) 웹 페이지, 이미지, API 데이터 등을 요청할 시
  2. POST : 서버에 데이터를 제출할 때 사용된다
    서버의 리소스에 변화를 일으킴
    ex) 폼 제출, 데이터 생성

  3. PUT : 서버에 존재하는 리소스를 업데이트 하거나 리소스를 생성할 때 사용한다
    지정된 리소스의 전체를 대체함
    ex) 파일 업로드, 리소스 전체 업데이트

  4. DELETE : 서버에서 리소스를 삭제할 때 사용된다
    ex) 데이터 삭제 요청

  5. HEAD : GET 메서드와 동일하지만 응답 본문(Body)를 포함하지 않는다
    응답의 헤더만 요청할 때 사용됨
    ex) 리소스의 데타데이터 조회

  6. OPTIONS : 서버에서 지원하는 메서드를 조회할 때 사용된다
    특정 리소스에서 가능한 통신 옵션을 확인
    ex) 서버의 기능 확인, CORS 프리플라이트 요청

  7. PATCH : 리소스의 부분을 업데이트 할 때 사용된다
    ex) 리소스의 일부 속성만 변경

  8. TRACE : 경로를 따라 요청 메세지를 테스트할 때 사용된다요청을 받은 서버가 응답에 메세지를 포함하여 반환한다ex) 디버깅용

 

HTTP 상태코드


HTTP 상태 코드는 서버의 응답 결과를 나타내며 클라이언트에게 요청의 처리 상태를 전달한다

상태 코드 종류

  1. 정보 응답 (1xx)
  2. 성공 응답 (2xx)
  3. 리다이렉션 (3xx)
  4. 클라이언트 오류 (4xx)
  5. 서버 오류 (5xx)

 

SSL 인증서


SSL 인증서는 웹사이트와 사용자 간의 연결을 암호화하는 디지털 인증서이다
이는 웹사이트의 신뢰성을 보장하고 기관에 의해 인증되었음을 확인할 수 있다

 

SSL 인증서 작동 과정

  1. 서버와 클라이언트의 연결 시도 : 클라이언트(웹 브라우저)가 서버에 접속을 시도
  2. 서버의 인증서 전송: 서버는 SSL 인증서를 클라이언트에게 전송
  3. 인증서 검증 : 클라이언트는 인증서의 유효성을 검사하고 
    인증서가 신뢰할 수 있는 기관에 의해 발급되었는지 확인
  4. 세션 키 교환 : 클라이언트와 서버는 안전한 연결을 위해 세션 키를 생성하고 교환
  5. 암호화된 데이터 전송 : 이후 클라이언트와 서버는 세션 키를 사용하여 암호화된 데이터를 주고받는다

 

 

도전과제


1. curl을 이용하여 HTTP 요청 직접 보내보기

2. 웹 브라우저 개발자 도구를 사용하여 웹 사이트의 HTTP 통신을 살펴보기

 

 

1. curl을 이용하여 HTTP 요청 직접 보내보기

요청은 GET, POST, PUT, DELETE를 사용해 보겠다
사이트는 JSONPlaceholder 를 사용해서 진행하겠다 (가짜 API 사용 가능)

 

 

GET 사용

GET은 method 기본값으로 GET명령어를 쓰지 않는다

posts/1을 사용한 이유는 posts로만 사용했을 때 값이 많이 나와서 1개만 나오게 했다

명령어를 입력하고 난 뒤에 {}안에 데이터가 보인다

 

POST 사용

-x 로 메소드 방법을 지정하고 -h로 헤더를 -d body로 지정하고 보냈다
헤더에는 json 형식을 사용할 것이라 적었다

 

PUT 사용

-x 와 -h는 동일하게 작성하였고 업데이트할 데이터를 변경해 주었다 (title, body)

 

DELETE 사용

이렇게 데이터를 삭제할 수 있었다

DELETE를 사용하니 {}안에 들어있던 데이터가 사라진것을 볼 수 있다

 

 

 

 

2. 웹 브라우저 개발자 도구를 사용하여 웹 사이트의 HTTP 통신을 살펴보기

먼저 google 홈 화면 network 화면을 보겠다

 

이후 페이지를 새로고침하면 새롭게 HTTP 요청이 표시 될 것이다

 

새로고침

 

이렇게 많은 요청들이 생겨난것을 볼 수 있다

 

1에서 했던 사이트에서 연계해서 할 수 있겠으나 코드가 잘 이해가 가지 않아 포기했다 ..