클라이언트에서 쿠키를 전달받지 못할 때

분명 서버에서 쿠키를 전달해주었음에도 클라이언트에서 이를 받지 못할 때가 있습니다.

개발자도구 > Network > Response Header에 Set-Cookie가 있는 걸로 보아 제대로 전달받은 것은 맞지만,
개발자도구 > Application 탭에 Cookie를 확인해보면 쿠키가 존재하지 않습니다.

이럴때 필요한 설정이 있는데요. 바로, 서버와 클라이언트에서 Credentials 옵션을 설정해주면 됩니다.

클라이언트

ajax 요청을 보낼 때 withCredentials 설정을 해야합니다.

axios.post('url', body, { withCredentials: true });

---

서버

서버에서는 cors 설정을 해야합니다.

express와, cors 라이브러리를 사용한다는 가정한다면,

app.use(cors({
  origin: '주소',
  credentials: true
}));

• origin을 주소가 아니라, *인 경우 모두 허용 / true인 경우 자동으로 설정해줍니다.

cors 라이브러리를 사용하지 않을 때,

res.setHeader('Access-Control-Allow-Origin', '주소');
res.setHeader('Access-Control-Allow-Credentials, 'true');