Recibo este error al usar ngResource para llamar a una API REST en Amazon Web Services:
XMLHttpRequest no puede cargar http://server.apiurl.com:8000/s/login?login=facebook . La respuesta a la solicitud de verificación previa no pasa la verificación de control de acceso: no hay ningún encabezado 'Access-Control-Allow-Origin' en el recurso solicitado. Por lo tanto, no se permite el acceso al origen 'http://localhost'. Error 405
Servicio:
socialMarkt.factory('loginService', ['$resource', function ($resource) { var apiAddress = "http://server.apiurl.com:8000/s/login/"; return $resource(apiAddress, { login: "facebook", access_token: "@access_token", facebook_id: "@facebook_id" }, { getUser: { method: 'POST' } }); }]);Controlador:
[...] loginService.getUser(JSON.stringify(fbObj)), function (data) { console.log(data); }, function (result) { console.error('Error', result.status); } [...] Estoy usando Chrome y no sé qué más hacer para solucionar este problema. Incluso configuré el servidor para aceptar encabezados de origen localhost .
Te encuentras con problemas de CORS.
Hay varias formas de arreglar/solucionar esto.
Más detalladamente, está intentando acceder a api.serverurl.com desde localhost. Esta es la definición exacta de solicitud de dominio cruzado.
Ya sea apagándolo solo para hacer su trabajo (está bien, pero poca seguridad para usted si visita otros sitios y simplemente patea la lata en el camino) puede usar un proxy que hace que su navegador piense que todas las solicitudes provienen del host local cuando realmente tienes un servidor local que luego llama al servidor remoto.
por lo que api.serverurl.com podría convertirse en localhost:8000/api y su nginx local u otro proxy lo enviará al destino correcto.
Ahora, por demanda popular,100 % más información de CORS ... ¡el mismo gran sabor!
Omitir CORS es exactamente lo que se muestra para aquellos que simplemente están aprendiendo el front-end. https://codecraft.tv/courses/angular/http/http-with-promises/
Mi "Servidor API" es una aplicación PHP, así que para resolver este problema encontré la siguiente solución que funciona:
Coloque las líneas en index.php
header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS'); header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');En la API web de AspNetCore, este problema se solucionó agregando "Microsoft.AspNetCore.Cors" (ver 1.1.1) y agregando los siguientes cambios en Startup.cs.
public void ConfigureServices(IServiceCollection services) { services.AddCors(options => { options.AddPolicy("AllowAllHeaders", builder => { builder.AllowAnyOrigin() .AllowAnyHeader() .AllowAnyMethod(); }); }); . . . }y
public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory) { // Shows UseCors with named policy. app.UseCors("AllowAllHeaders"); . . . } y poner [EnableCors("AllowAllHeaders")] en el controlador.