api - dominio - ¿Por qué se aplica la misma política de origen cuando se solicita desde localhost a localhost?

localhost 8080

Question

Mantengo la API backend como un proyecto separado de la aplicación frontend HTML5 que lo consume. Estoy usando Yeoman para el desarrollo frontend. Yeoman se ejecuta en localhost: 3501 y el backend en localhost: 3000. Cuando realizo la solicitud de la API desde el navegador (usando $ http de AngularJS), toco la misma política de origen:

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

AFAIK, la misma política de origen debería activarse solo cuando se realiza una solicitud en diferentes dominios. ¿Por qué gime cuando hacemos una solicitud de localhost a localhost (aunque a un puerto diferente)?

¿Cómo puedo hacer que esto funcione y esto causará problemas en la producción?

Answer 1

Los puertos también cuentan para solicitudes de dominios cruzados, por lo tanto, http://localhost:3000 y http://localhost:3501 son 2 dominios diferentes (desde el punto de vista del navegador).

Si necesita ambas aplicaciones (cliente y servidor) para ejecutar en diferentes puertos, considere usar http://enable-cors.org/

Answer 2

Según W3C , "Un origen está definido por el esquema, el host y el puerto de una URL", por lo que el puerto diferente está causando sus problemas.

Dos posibles soluciones:

• CORS (Intercambio de recursos de origen cruzado)
• Usando solicitudes JSONP

Ambos requerirían cambios en tu back-end (no estoy lo suficientemente familiar. CORS probablemente significaría los menos cambios en tu frontend (creo que AngularJS lo admite desde el primer momento).