2021.12.13

Cookie 이슈

CORS 요청에 Cookie가 제대로 실려나가지 않는 이슈가 있었다.

쿠키를 정상적으로 포함시키는 방법

http client -> http api server

• [Request] withCredentials: true
• [Response] Control-Allow-Origin: 클라이언트_오리진
• [Response] Access-Control-Allow-Credentials: true

http client -> https api server

• [Request] withCredentials: true
• [Cookie] Secure
• [Cookie] SameSite=None
• [Response] Control-Allow-Origin: 클라이언트_오리진
• [Response] Access-Control-Allow-Credentials: true

마주쳤던 이슈들..

• 서버의 Access-Control-Allow-Origin에 프로토콜을 포함시켜야한다.
• withCredential: true인 요청에 대해선 반드시 Access-Control-Allow-Credentials: true를 해주어야 함
• 서버에서Access-Control-Allow-Credentials: true 를 해줄 경우 Access-Control-Allow-Origin의 값으로 *값이 불가능하다. 명시적으로 origin을 적어주어야 한다.
• 자동으로 명시적으로 origin을 적어주기위해 cors 라이브러리를 사용하면 편하다.

const cors = require("cors");

//...

app.use(
  cors({
    origin: true, // request의 origin을보고 Access-Control-Allow-Origin을 자동으로 세팅해준다.
    credentials: true, // Access-Control-Allow-Credentials: true
  })
);

//...