localhost에서 localhost로 요청할 때 동일한 출처 정책이 시작되는 이유는 무엇입니까?

Question

저는 프론트 엔드 HTML5 앱에서 별도의 프로젝트로 백엔드 API를 사용하고 있습니다. 전 프론트 엔드 개발에 Yeoman을 사용하고 있습니다. Yeoman은 localhost : 3501에서 실행되고 backend는 localhost : 3000에서 실행됩니다.

XMLHttpRequest cannot load http://localhost:3000/venues. Origin http://localhost:3501 is not allowed by Access-Control-Allow-Origin. 

AFAIK, 동일 출처 정책은 다른 도메인에서 요청하는 경우에만에서 킥한다 : 나는 브라우저에서 API 요청을 할 때 (AngularJS와의 $ HTTP를 사용하여), 나는 같은 원본 정책을 누르십시오. localhost에서 localhost (다른 포트 임에도 불구하고)에서 요청할 때 왜 우는 소리가 나나요?

이 작업을 수행하려면 어떻게해야합니까? 그러면 프로덕션 환경에서 문제가 발생합니까?

Answer 1

포트도 상호 도메인 요청에 포함되므로, http://localhost:3000 및 http://localhost:3501은 두 개의 도메인 (브라우저의 관점에서 볼 때)입니다.

당신이 두 응용 프로그램 (클라이언트 및 백엔드) 사용을 고려, 다른 포트에서 실행해야하는 경우 http://enable-cors.org/

Answer 2

W3C에 따르면, "는 기원이 URL의 계획, 호스트 및 포트에 의해 정의된다", 그래서 다른 포트가 문제의 원인입니다.

두 가지 가능한 솔루션 :

• CORS (간 리소스 공유)는
• 은 JSONP 내가 하시다 충분히 익숙하지 않다 (

모두 백엔드에 대한 변경을 요구를 요청하여 CORS를. 아마도 프론트 엔드에 대한 최소한의 변화를 의미 할 것입니다 (저는 AngularJS가 그것을 out-of-the-box로 지원한다고 생각합니다).