`mode: 'no-cors'`가 실패할 때 가져오기를 사용하여 다른 출처의 리소스에 어떻게 액세스할 수 있습니까?

모드로 가져오기 사용 시도: no-cors

이 기사에서는 모드로 가져오기 사용 문제를 다룰 것입니다. 'no-cors'를 선택하고 CORS를 비활성화할 수 있는 실행 가능한 대안을 찾아보세요.

이해하기 문제

외부 API 등 다른 출처의 리소스에 액세스하려고 하면 브라우저는 동일 출처 정책이라는 보안 조치를 구현합니다. 이 정책은 서버가 적절한 CORS 헤더로 응답하지 않는 한 JavaScript 코드가 다른 원본의 리소스에 직접 액세스하는 것을 방지합니다.

"요청된 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다' 오류가 발생하는 경우 ,' 이는 데이터를 가져오려는 서버가 현재 원본의 리소스에 대한 액세스를 허용하지 않는다는 의미입니다.

비활성화 CORS

가져오기 요청의 모드: 'no-cors' 설정이 실제로 CORS를 비활성화하지 않는다는 점에 유의하는 것이 중요합니다. 대신 프런트엔드 JavaScript 코드가 응답 본문과 헤더에 액세스하는 것을 방지합니다. 대부분의 경우 이는 의도한 바가 아닙니다.

CORS 프록시 사용

권장되는 해결 방법은 CORS 프록시를 사용하는 것입니다. CORS 프록시는 프런트엔드 코드와 대상 서버 사이의 중개자 역할을 합니다. 대상 서버에 요청하고, 응답을 받고, 필요한 CORS 헤더를 추가한 다음, 수정된 응답을 프런트엔드 코드에 다시 전달합니다. 이를 통해 동일 출처 정책을 직접 위반하지 않고도 프런트엔드 코드가 리소스에 액세스할 수 있습니다.

자신만의 CORS 프록시 배포

다음 단계에 따라 자신만의 CORS Anywhere 프록시를 쉽게 배포할 수 있습니다.

1. CORS Anywhere 저장소 복제: git clone https://github.com/Rob--W/cors-anywhere.git
2. cors-anywhere 디렉토리로 변경: cd cors-anywhere/
3. 종속성 설치: npm install
4. Heroku 앱 만들기: heroku create
5. Heroku에 코드 푸시: git push heroku master

이 단계를 수행하면 Heroku에서 실행되는 자체 CORS Anywhere 서버를 갖게 됩니다.

CORS 프록시 사용

CORS 프록시를 사용하려면 간단히 요청 URL 앞에 프록시 URL을 붙입니다. 예:

https://cryptic-headland-94862.herokuapp.com/https://example.com

CORS 프록시를 사용하면 다음을 수행할 수 있습니다. 동일 출처 정책을 우회하고 프런트엔드 코드에서 다른 출처의 리소스에 액세스하세요.

위 내용은 `mode: 'no-cors'`가 실패할 때 가져오기를 사용하여 다른 출처의 리소스에 어떻게 액세스할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!