Cors 에러 해결기 (credentials)

문린이·2022년 12월 9일
0

또 찾아온 cors 에러 해결하기

잊을만하면 cors 에러가 또 나온다. 이놈의 cors....

에러 내용

Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.

mdn을 찾아본 결과 이러한 내용이 있다.

참고: credentials: 'include'를 추가한 경우, Access-Control-Allow-Origin에 와일드카드를 사용할 수 없습니다. 자격 증명을 포함하려는 경우에는 반드시 정확한 출처를 지정해야 합니다. CORS 해제 확장 프로그램을 사용하더라도 와일드카드를 지정한 요청은 실패할 것입니다.

-> 사실 mdn 말대로 정확한 출처를 지정하는 게 가장 좋은 해결 방법이다.

  • *이 아닌 실제 주소!

먼저 withCredentials를 false로 변경해 봤지만 해결할 수 없었다.
withCredentials는 client 와 server의 쿠키 공유 여부를 말한다.

credentials의 종류

  1. include : 브라우저가 요청을 전송할 때 자격 증명을 포함

  2. same-origin : 요청 URL이 스크립트와 같은 출처일 때만 자격 증명을 전송

  3. omit : 브라우저가 요청에서 자격 증명을 전송하지 않도록

나 같은 경우에는

const link = createHttpLink({
  uri: ---,
  credentials: 'include',
});

이었던 코드를

const link = createHttpLink({
  uri: ---,
  credentials: 'same-origin',
});

로 변경해서 해결할 수 있었다.

profile
Software Developer

0개의 댓글