¿Cómo hacer solicitudes HTTP habilitadas para CORS en Angular 2?

El error es el siguiente:

XMLHttpRequest no puede cargar http://some_url.herokuapp.com/api/some_api/ . Ningún encabezado ‘Access-Control-Allow-Origin’ está presente en el recurso solicitado. El origen ‘ http: // localhost: 3000 ‘ no está, por lo tanto, permitido. La respuesta tenía el código de estado HTTP 503.

cuando llamas

return this._http.post (requestUrl, JSON.stringify (requestBody), requestOptions)

Tuve problemas con CORS (cuando trabajaba con Angular 1 ) en el pasado y recuerdo que una vez que se activaron los CORS en el lado del servidor, tuve que transformar la solicitud http para analizar ciertos encabezados HTTP .

Estoy bastante confundido acerca de cómo debería funcionar, por lo que cualquier explicación es muy bienvenida.

De hecho, no es un problema Angular2, sino un problema en el lado del servidor. La solicitud de OPCIONES con verificación previa debe devolver un encabezado Access-Control-Allow-Origin en su respuesta.

Enviar el encabezado Origin en la solicitud original habilitará el soporte CORS en el lado del servidor. Este encabezado se agrega automáticamente por el navegador cuando detecta que el dominio de la solicitud no es el mismo que el de la persona que llama.

Tenga cuidado al implementar la solicitud de OPCIONES de verificación previa en el lado del servidor, ya que las credenciales no se envían a este nivel . Solo se envían dentro de la solicitud de destino. Parece ser el problema ya que tienes el error 503. Está intentando verificar si la solicitud de OPTIONS está autenticada, pero en realidad no es el caso …

Vea este artículo para más detalles: