🏃🏻2024년 제6회 K-디지털 트레이닝 해커톤🏃🏻 : 백엔드 연결

도키도키

---

---

안됨

저번 플젝에서도 이렇게 햇는데 원래 이렇게 하는 게 완전 기본인가?

백엔드 공부도 해야 하는데

회원가입하고

실패

Authorization 헤더

서버에 사용자 인증 정보를 제공하기 위해 사용

API에서 사용자를 인증하거나 특정 권한을 가진 사용자에게만 접근을 허용하는 경우에 사용

 

회원가입/로그인해서 인증 토큰을 받은 후에 헤더에 넣어서 요청

 

쿠키에 인증 정보가 자동으로 저장되고, 그 쿠키가 브라우저의 다른 요청에 자동으로 포함되게 만든 듯

로그인하면

쿠키가 박힌 모습

이제 요청 날리면 알아서 쿠키 값을 가져가게 됨

200 오키

---

import axios from "axios";

export const instance = axios.create({
  baseURL: import.meta.env.VITE_BASE_URL,
  withCredentials: false,
  headers: {
    "Content-Type": "application/json",
  },
});

// 요청 인터셉터 설정
instance.interceptors.request.use(
  (config) => {
    // access_token을 sessionStorage에서 가져와 헤더에 추가
    const token = sessionStorage.getItem("access_token");
    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
    }
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);