withCredentials: true

 

리액트에서 axios를 사용할 때

withCredentials: true를 설정하는 것은

클라이언트가 서버와 통신할 때 쿠키를 포함한 자격 증명을 함께 보내겠다는 뜻입니다.

쉽게 설명하자면, 서버와의 요청에서 로그인 상태나 사용자 정보를 유지하기 위해 필요한 설정입니다.

 

예를 들어, 어떤 웹사이트에 로그인한 상태에서 다른 페이지로 이동하거나 데이터를 요청할 때,

서버는 이 사용자가 누구인지 알아야 합니다.

이때 쿠키가 사용자 정보를 담고 있으며,

withCredentials: true를 설정하면 이 쿠키를 서버로 함께 보내어 서버가 사용자를 인식할 수 있게 합니다.

 

다음은 withCredentials 옵션을 사용하는 간단한 예제입니다.

import axios from 'axios';

axios.get('https://example.com/data', {
  withCredentials: true
})
.then(response => {
  console.log(response.data);
})
.catch(error => {
  console.error('Error fetching data:', error);
});

 

위 코드에서 withCredentials: true를 설정함으로써,

요청이 서버로 보내질 때 브라우저에 저장된 쿠키가 함께 전송되어 서버가 클라이언트를 인식할 수 있게 됩니다.

이와 같은 설정은 주로 사용자 인증이 필요한 경우에 사용됩니다.