문제발생)
has been blocked by CORS policy: 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'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
번역 - CORS 정책에 의해 차단됨: 사전 비행 요청에 대한 응답이 액세스 제어 검사를 통과하지 못함: 요청의 자격 증명 모드가 '포함'인 경우 응답의 '액세스-컨트롤-허용-오리진' 헤더 값이 와일드카드 '*'이면 안 됩니다. XMLHttpRequest에 의해 시작된 요청의 자격 증명 모드는 withCredentials 특성에 의해 제어됩니다.
presignedURL로 이미지를 업로드 하려고 하니까 이 에러를 만났다.
시도해보자)
CORS에러가 권한에러라고 들었는데... S3에 CORS 설정하는거 뭐 있었던 것 같은데..! 하고 확인해보니
AWS cors 설정하는 부분에는 잘 설정이 되어있었다.
이 문제가 아닌것 같다..
'액세스-컨트롤-허용-오리진' 헤더 값이 와일드카드 '*'이면 안 된댔는데..
나는 별이다.. 흐음....
백엔드 코드에서 바꿔줘야 하나...?
다른사람이 짠 코드여서 함부로 바꿀 수 없을 것 같다...
어떻게 해야하지...
https://www.hahwul.com/2019/04/10/why-failed-get-data-with-this-cors-policy/
Access-Control-Allow-Origin가 wildcard(*)일 때 왜 인증 정보를 포함한 요청은 실패하는가 😫
TL;DR CORS 정책 상 Access-Control-Allow-Origin: * 인 경우 Origin의 제한없이 요청하고 결과를 읽을 수 있지만, 이러한 경우 쿠키를 제거하고 요청하도록 정책이 구성되어 있어서 인증 정보를 포함한 요청
www.hahwul.com
-> 이 블로그 찾았다.
CORS 정책 상 Access-Control-Allow-Origin: * 인 경우 Origin의 제한없이 요청하고 결과를 읽을 수 있지만, 이러한 경우 쿠키를 제거하고 요청하도록 정책이 구성되어 있어서 인증 정보를 포함한 요청에서는 불가능합니다.
마침 우리 프로젝트는 쿠키를 사용하고 있지 않아서 아래 코드를 적용해보았다.
xhrFields: {
withCredentials: false,
},
CORS 에러는 해결되었다..
하지만 다른에러가 발생했다..
FormData가 아닌 바이너리로 보내라는 에러...
이제 저것만 넘으면.. 산하나 넘는다..!!
할 수 있다..!!