본문 바로가기
웹/Javascript

http 통신

by hihijh826 2023. 8. 3.
728x90
반응형
SMALL

1-1) http 란

  • 프로토콜 : 클라이언트와 서버 간에 자료를 주고받을 때 필요한 규칙

→ http : 웹에서 사용하는 프로토콜

  • http 요청 : 클라이언트에서 서버로 자료 요청
  • http 응답 : 서버에서 응답해서 클라이언트로 자료 보냄

1-2) 요청 헤더와 응답 헤더

  • 헤더 : 클라이언트에서 서버로 전송되는 형태
  • 요청헤더 : 클라이언트 → 서버 (요청할 때 보내는 헤더)
  • 응답 헤더 : 서버 → 클라이언트 (메시지를 보내는 시간, 어떻게 표시할지)
  • 응답 본문 : 서버→ 클라이언트 ( 실제 이미지, 텍스트 등 실제 사이트 내용)

1-3) 요청방식, GET, POST

: 요청 헤더의 방식(method)

클라이언트 → 서버 : 요청 헤더 + 요청 본문 함께 전송

<GET>

  • 서버로 자료를 무언가를 요청할 때 주소의 뒤에 자료를 붙여서 보내는 방식
  • 웹 브라우저의 창의 주소 표시줄에 요청 메시지가 함께 표시되고 요청 본문은 따로 사용하지 않음

.json() : json으로 바꿔준다는 내용

.text() : text로 바꿔준다는 내용

<POST>

  • 서버로 어떤 데이터를 보내 줄 때 사용
  • 요청 본문(body)에 따로 담겨서 전송
  • , '/join' 으로 request url이 탐지되면, 이제 클라이언트에서 보낸 데이터를 획득하고(request 객체에 담겨서 온 값) 그 값이 올바른지 확인하거나 아니면 DB에 그 값을 추가하는 등의 작업을 할 겁니다.
  • text로 바꿔줘야됨. JSON.stringify() 사용
fetch('/topics', {
    method:'POST',
    
    //텍스트로 바꿔줘야 된다.
    body:JSON.stringify({title:'html', body:'html is ..'}), 
    
    // 내가 보낸건 json이야~ 라고 서버에게 말해주는 것
    headers: {
        'Content-Type': 'application/json'
    }})

 

728x90
반응형
LIST

' > Javascript' 카테고리의 다른 글

canvas  (0) 2023.08.03
동기 /비동기  (0) 2023.08.03
fetch  (0) 2023.08.03
서버에서 자료 가져오기  (0) 2023.08.03
json이란  (0) 2023.08.03