关于javascript:AngularJS:请求的资源上没有“Access-Control-Allow-Origin”标头

AngularJS: No “Access-Control-Allow-Origin” header is present on the requested resource

本问题已经有最佳答案,请猛点这里访问。

我正在写我的webApp,我正在使用AngularJS。 在这个应用程序中,我创建了一个名为script.js的文件,并报告此代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
var modulo = angular.module('progetto', ['ngRoute']);

    // configure our routes
    modulo.config(function ($routeProvider, $httpProvider) {
        $routeProvider

            // route for the home page
            .when('/', {
                templateUrl: 'listaFilm.html',
                controller: 'listaController'
            })

            // route for the description page
            .when('/:phoneName', {
                templateUrl: 'description.html',
                controller: 'descriptionController'
            });


            $httpProvider.defaults.headers.common['Access-Control-Allow-Origin'] = '*';

    });


    modulo.controller('listaController', function ($scope, $http) {
        $http.get('https://api.getevents.co/event?&lat=41.904196&lng=12.465974').success(function (data) {
            $scope.names = data;
            }).
            error(function (data, status) {
                $scope.names ="Request failed";
            });
    });

使用此代码,我按照RESTful原则调用API。 当我运行代码时,我遇到了这个问题:

XMLHttpRequest cannot load https://api.getevents.co No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:8383' is therefore not allowed
access.

在网上阅读我明白我有一个叫CORS的问题...我已经尝试了几个解决方案,但我没有解决问题。
我该如何解决这个问题?
我必须添加什么代码来修复它?


这是服务器端问题。 您不需要为角色添加角度的任何标题。
您需要在服务器端添加标头:

1
2
3
Access-Control-Allow-Headers: Content-Type
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Origin: *

前两个答案:如何在AngularJs中启用CORS


CORS是跨源资源共享,如果您尝试从一个域访问另一个域,则会出现此错误。

尝试使用JSONP。 在您的情况下,JSONP应该工作正常,因为它只使用GET方法。

尝试这样的事情:

1
2
3
4
5
6
7
8
9
10
11
var url ="https://api.getevents.co/event?&lat=41.904196&lng=12.465974";
$http({
    method: 'JSONP',
    url: url
}).
success(function(status) {
    //your code when success
}).
error(function(status) {
    //your code when fails
});