네트워크 통신을 쉽게 해주는 Fetch

기본적으로 jQuery.ajax() 와 기본적으로 두가지가 다르다.

• fetch()로 부터 반환되는 Promise 객체는 HTTP error 상태를 reject하지 않는다. 404, 500을 반환하더라도 ok상태가 false resolve가 반환되며, 네트워크 장애나 요청이 완료되지 못한 상태에는 reject을 반환한다.
• 보통 쿠키를 보내지 않기 떄문에 자격증명 옵션을 설정해야한다.

fetch(`${url}/login`, {
    method: "post",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(data),
  })
    .then((res) => res.json())
    .then((res) => {
      localStorage.setItem("access_token", res.access_token);
      localStorage.setItem("id", res.id);
      localStorage.setItem("user_email", res.user_email);
      console.log(localStorage.getItem("user_email"));
      console.log(res.access_token);
      message("success", "Login", "you success login!");
      location.href = "../dashboard.html";
    })
    .catch((error) => {
      message("error", "Not Login", "Something...problem");
    });

참고자료

Using Fetch - Web API | MDN