HTTP(Hypertext Transfer Protocol)

web에서 서버와 클라이언트 간의 통신하는 방법을 정한 것
클라이언트는 웹 브라우저 등 서버로 요청을 보내는 대상.
서버는 클라이언트가 요청을 보내기 전까지 대응하지 않음.
서버와 클라이언트 사이에는 무수히 많은 요소가 존재하는데 HTTP는 이런 존재들 사이의 통신 방법을 규정한다.

HTTP Message

서버 주소, 요청 메서드, 상태 코드, target path, 헤더 정보, 바디 정보 등이 포함되어 있음.
요청 메시지, 응답 메시지의 모양이 다름.
HTTP/1.1 메시지는 사람이 읽을 수 있음

HTTP Header

콘텐츠 관련 정보, 인증 관련 정보, 쿠키 정보, 캐시 관련 정보 등 서버와 클라이언트 간 통신 시 필요한 정보를 담는다.
클라이언트 요청 시, 서버 응답 시 모두 헤더에 정보를 담을 수 있다.

HTTP Status

HTTP요청 시, 클라이언트는 요청의 결과에 대한 상태 정보를 얻는다.
200, 400, 500등 숫자 코드와, Ok, Not found 등의 텍스트로 이루어지며
코드를 이용해 각 결과에 해당하는 행위를 할 수 있음!

요청 메서드

HTTP에서, 클라이언트는 서버로 요청을 보낸다.
GET, POST, PUT, PATCH, DELETE, OPTIONS, CONNECT, TRACE등이 규정됨

Fetch API

Response

fetch(serverURL)
	.then(res => {
  		res.ok
  		res.status
  		res.statusText
  		res.url
  		res.bodyUsed
})

response.ok는 HTTP Status code 가 200-299사이면 true, 그 외에는 false
response.status는 HTTP status code를 담는다.
response.url은 요청한 URL 정보를 담는다.
response.headers로 response 객체의 헤더 정보를 얻을 수 있다.

Body 메서드

fetch(serverURL)
  .then(res => {
    return res.json()
  })
  .then(json => {
    console.log('body : ', json)
})

response.json() 메서드는 얻어온 body 정보를 json으로 만드는 Promise를 반환한다.
Promise가 resolve되면 얻어온 body 정보를 읽는다.
response.text(), response.blob(), response.formData() 등의 메서드로 다른 형태의 바디를 읽는다.

POST 요청

fetch(serverURL, {
  method: 'post',
  header: {
    'Content-Type': 'application/json;charset=utf-8',
    Authentication:'secret'
  },
  body: JSON.stringify(formData)
})
  .then(res => {
  	return res.json()
})
  .then(json => {
    console.log('POST 요청 결과:', json)
})

fetch(url, options)로, fetch 메서드 옵션을 넣는다.
method필드로 여러 요청 메서드를 활용할 수 있다.
headers, body 필드를 활용해 서버에 추가 정보를 보낸다.!

---

오늘수업은 좀 수월했는데, fetchAPI부분은 조금 더 봐야할듯!ㅎㅅㅎ