Fetch
fetch() 프로미스는 네트워크에 오류가 있었거나, 서버의 CORS 설정이 잘못된 경우 TypeError로 거부됩니다.
그러나 이 두 경우는 권한처럼 설정의 문제고, 404와 같은 응답은 네트워크 오류가 아니므로 거부하지 않습니다. fetch()가 성공했는지를 정확히 알아내려면 프로미스의 이행 여부를 확인한 후, Response.ok 속성의 값이 true인지도 확인해야 합니다.
- fetch는 api 요청 자체가 실패한 게 아니라면, http status가 어떤 값이던 간에 오류라고 판단하지 않는다
fetch('https://jsonplaceholder.typicode.com/posts/1')
.then(res => res.json())
.then(data => console.log(data))해당 url이 아예 존재하지 않는 url일 경우 or 서버 자체가 잘못된 경우 ->
Uncaught (in promise) TypeError: Failed to fetch 라는 오류가 반환된다
해당 서버에 요청은 정상적으로 갔으나, header 설정이 잘못되었거나 에러 코드(400 , 404 등)을 반환할 경우
-
fetch는 이걸 '오류' 라고 판단하지 않음
-
fetch의 결과로 받아본
res라는 객체에서 status , statusText , ok 라는 속성으로 판단해서, 직접 오류인지 아닌지를 판단 해줘야 함 -
가장 많이 사용하는 속성이
res.ok- The ok read-only property of the Response interface contains a Boolean stating whether the response was successful (status in the range 200-299) or not.
- response의 status가 200~299 사이일 경우 ok가 true / 아니면 false
-
요약하자면 , fetch는 단순히 본인이 서버에 요청한 것이 실패했을 때만 오류를 발생한다
-
요청이 올바르게 갔다면, 응답의 결과를 보고 실패했는지 / 아닌지를 판단하고 후속조치는 내가 알아서 해야함
-
만약 status가 400번대였다면,
.json()과정에서 오류가 발생할 수 있음- 그 전에 미리 유효한 status였는지 확인하는 과정 필요
