XMLHttpRequest.send()는 다음 JS로, 액세스 제어 - 허용 - 원산지 오류

I 제 3 자 서비스에 대한 API 호출을하기 위해 노력하고있어

가 발생합니다 그러나XMLHttpRequest.send()는 다음 JS로, 액세스 제어 - 허용 - 원산지 오류

<script> 
var xhr = new XMLHttpRequest(); 
xhr.open("GET", "https://api.something.com/apikeyetcetc", false); 
xhr.send(); 

console.log(xhr.status); 
</script>

의 XHR에서. send() 행을 실행하면 브라우저의 콘솔에서이 오류가 발생합니다.

XMLHttpRequest는 https://api.something.com/apikeyetcetc을로드 할 수 없습니다. 아니요 요청한 리소스에 'Access-Control-Allow-Origin'헤더가 있습니다. 따라서 'http://localhost:8888'의 출처는 허용되지 않습니다.

MacOS Sierra 새로 설치시 www.mamp.info의 MAMP를 사용하여 로컬 서버를 실행하고 있습니다.

은 내가 만든 HTML 파일과 같은 디렉토리에 .htaccess 파일을 생성하고 다음 줄을 추가 :

Header set Access-Control-Allow-Origin "*"

를하지만 도움이하지 않는 것 같습니다. Apache 및 다른 구성에서 CORS에 대한 다양한 제안을 보았습니다.하지만 무작위로 시도하기 전에 여기에서 무슨 일이 벌어지고 있는지 확실히 알고 싶습니다. (특히 깨끗한 개발 환경이있는 동안). 무슨 일이 벌어 질지 몰라요?

편집 : 사용하려고하는 API는 다크 스카이입니다.

출처

2016-10-14 chimerical

일부 해결책은 ~ http://stackoverflow.com/questions/15005500/loading-cross-domain-html-page-with-ajax – Phil

요청을 프록시하기 위해 서버에서 cURL을 사용하십시오. – charlietfl

@Phil Wait, 이것이 이유는 무엇입니까? 중복으로 표시 되나요? 유사한 영역을 다루지 만, 스레드의 질문은 다른 것을 묻는 것이 었습니다. 동일한 출처 정책과 CORS에 대한 일반적인 링크가 흩어져있는 것과는 대조적으로 단일 솔루션을 실제로 갖고 있지 않습니까? – chimerical

로컬 서버의 설정으로 인한 문제가 아니므로 .htaccess 파일을 추가해도 도움이되지 않습니다.

API를 호스팅하는 서버의 응답에 Access-Control-Allow-Origin 헤더가 없으므로 문제가 발생합니다. 사용하려고하는 API가 무엇인지 물어봐도 될까요?

API가 제어 할 수없는 경우 몇 가지 옵션이 있습니다. NodeJS를 사용하여 CORS 프록시를 설정할 수 있습니다. 예를 들어 몇 가지가 있습니다. https://www.npmjs.com/package/corsproxy

또는 개발 중에 브라우저가 요청을 차단하지 못하게하는 브라우저 확장을 설치할 수 있습니다. Chrome 용으로는 몇 가지가 있으며, Firefox가 적어도 하나는 가지고 있다고 생각합니다. (다른 웹 사이트에서 문제를 일으킬 수 있으므로 사용하지 않을 때는 사용 중지해야합니다.)

출처

2016-10-14 02:13:16 DanDooley

물론, 내가 사용하려고하는 API는 Dark Sky 's입니다. https://darksky.net/dev/docs – chimerical

XMLHttpRequest.send()는 다음 JS로, 액세스 제어 - 허용 - 원산지 오류

답변

관련 문제