origin falta control cabecera allow angularjs ajax cors cross-domain

falta - No hay encabezado ''Access-Control-Allow-Origin'' en el recurso solicitado- AngularJS



cors angular 6 (13)

XMLHttpRequest cannot load http://mywebservice. No ''Access-Control-Allow-Origin'' header is present on the requested resource. Origin ''http://localhost:9000'' is therefore not allowed access.

Recibo este error cuando intento ejecutar mi servicio web desde mi código. Traté de encontrarlo e intenté con muchas soluciones que me sugirieron y encontré en la red. Pegando el código a continuación.

<form name="LoginForm" ng-controller="LoginCtrl" ng-submit="init(username,password,country)"> <label>Country</label><input type="text" ng-model="country"/><br/><br/> <label>UserName</label><input type="text" ng-model="username" /></br></br> <label>Password</label><input type="password" ng-model="password"> </br> <button type="submit" >Login</button> </form>

Y el controlador de la JS correspondiente es:

app.controller(''LoginController'', [''$http'', ''$scope'', function ($scope, $http) { $scope.login = function (credentials) { $http.get(''http://mywebservice'').success(function ( data ) { alert(data); }); } }]);

El servicio web funciona bien cuando lo presiono desde la barra de URL. ¿Cómo resolver el problema? Amablemente ayuda!

Añadí esto y funcionó bien para mí.

web.api

config.EnableCors();

Luego llamarás al modelo usando cors:

En un controlador agregará en la parte superior para el alcance global o en cada clase. Tu decides.

[EnableCorsAttribute("http://localhost:51003/", "*", "*")]

Además, cuando envía estos datos a Angular, también quiere que se llame al archivo .cshtml, o bien empujará los datos pero no completará su vista.

(function () { "use strict"; angular.module(''common.services'', [''ngResource'']) .constant(''appSettings'', { serverPath: "http://localhost:51003/About" }); }()); //Replace URL with the appropriate path from production server.

Espero que esto ayude a cualquiera, me tomó un tiempo entender Entity Framework, y por qué CORS es tan útil.

Así es como funcionó para mí. Para usuarios de Windows que prueban con Soporte y AngularJS

1) Ve a tu escritorio

2) Haga clic derecho en su escritorio y busque "NUEVO" en el cuadro de diálogo emergente desplegable y se expandirá

3) Elija atajo

4) Se abrirá un cuadro de diálogo

5) Haga clic en Buscar y busque Google Chrome.

6) Haga clic en Aceptar-> Siguiente-> Finalizar y se creará el acceso directo de Google en su escritorio

7) Ahora haz clic derecho en el ícono de Google Chrome que acabas de crear

8) Haga clic en propiedades

9) Ingrese esto en la ruta de destino

"C:/Program Files/Google/Chrome/Application/chrome.exe" --args --disable-web-security

10) guárdalo

11) Haz doble clic en el acceso directo de Chrome recién creado y pasa el enlace en la barra de direcciones y funcionará.

En el lado del cliente puede habilitar las solicitudes de cors en AngularJS a través de

app.config([''$httpProvider'', function($httpProvider) { $httpProvider.defaults.useXDomain = true; delete $httpProvider.defaults.headers.common[''X-Requested-With'']; } ]);

Sin embargo, si esto sigue generando un error, esto implicaría que el servidor que está realizando la solicitud debe permitir la solicitud de CORS y debe estar configurado para eso.

En mi caso, estaba intentando conectar un servicio WebAPI en localhost desde dentro de una aplicación MVC que usaba mucho código angular. Mi servicio WebAPI funcionó bien con Fiddler a través de http://localhost/myservice . Una vez que me tomé un momento para configurar la aplicación MVC para usar IIS en lugar de IIS Express (una parte de Visual Studio), funcionó bien, sin agregar ninguna configuración relacionada con CORS a ninguna área.

Es un problema en el lado del servidor. Debes agregar la dirección de tu cliente a la API expuesta de tu servidor. Si está utilizando el trabajo de marco Spring, puede anotar @CrossOrgin de org.springframework.web.bind.annotation.CrossOrigin;

Ejemplo: @CrossOrigin (origins = " http: // localhost: 8080 ")

Este es un problema CORS . Hay algunos ajustes que puede cambiar en angular: estos son los que normalmente configuro en el método Angular .config (no todos están relacionados con CORS):

$httpProvider.defaults.useXDomain = true; $httpProvider.defaults.withCredentials = true; delete $httpProvider.defaults.headers.common["X-Requested-With"]; $httpProvider.defaults.headers.common["Accept"] = "application/json"; $httpProvider.defaults.headers.common["Content-Type"] = "application/json";

También necesita configurar su servicio web; los detalles de esto dependerán del idioma del lado del servidor que esté utilizando. Si usa una herramienta de monitoreo de red, verá que envía una solicitud de OPCIONES inicialmente. Su servidor debe responder adecuadamente para permitir la solicitud de CORS.

La razón por la que funciona en su navegador es porque no es una solicitud de origen cruzado, mientras que su código angular es.

Reemplazar get con jsonp :

$http.jsonp(''http://mywebservice'').success(function ( data ) { alert(data); }); }

Tengo una solución a continuación y me funciona:

app.controller(''LoginController'', [''$http'', ''$scope'', function ($scope, $http) { $scope.login = function (credentials) { $http({ method: ''jsonp'', url: ''http://mywebservice'', params: { format: ''jsonp'', callback: ''JSON_CALLBACK'' } }).then(function (response) { alert(response.data); }); } }]);

en '' http: // mywebservice '' debe haber necesidad de un parámetro de devolución de llamada que devuelva JSON_CALLBACK con datos.
Hay un ejemplo de muestra debajo que funciona perfecto

$scope.url = "https://angularjs.org/greet.php"; $http({ method: ''jsonp'', url: $scope.url, params: { format: ''jsonp'', name: ''Super Hero'', callback: ''JSON_CALLBACK'' } }).then(function (response) { alert(response.data); });

ejemplo de salida:

{"name":"Super Hero","salutation":"Apa khabar","greeting":"Apa khabar Super Hero!"}

tengo

No hay encabezado ''Access-Control-Allow-Origin'' presente

y el problema fue con la URL que estaba proporcionando. Proporcioné la URL sin una ruta, por ejemplo, https://misty-valley-1234.herokuapp.com/ .

Cuando agregué un camino, funcionó, por ejemplo, https://misty-valley-1234.herokuapp.com/messages . Con las solicitudes GET, funcionó de cualquier manera, pero con las respuestas POST solo funcionó con la ruta agregada.