如何克服 Angular JS 的 CORS 问题答案

【问题标题】：How To Overcome CORS Issue From Angular JS如何克服 Angular JS 的 CORS 问题
【发布时间】：2014-08-30 00:36:58
【问题描述】：

从我的 Angular JS 代码调用 REST 服务时，我遇到了一个问题：

服务：

app.factory('UserFactory', function ($resource) {
    return $resource('http://localhost:8080/demoApp/service/users', {}, {
        show: { method: 'GET', isArray: true },       
    })
});

控制器：

function userListController($scope, UserFactory){   
    $scope.showUser = function () {
        alert("Show user ...");
        $scope.fetchedData = [];
        $scope.users = UserFactory.show();
        $scope.fetchedData.push($scope.users);

    };    
}

为了克服 CORS，我们实现了 Java CORS 过滤器，如下所示 -

Following line were written in doFilter method inside a Filter -

 response.setHeader("Access-Control-Allow-Origin", "*");

 response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");

 response.setHeader("Access-Control-Max-Age", "3600");

 response.setHeader("Access-Control-Allow-Headers", "x-requested-with");

它与 $http.jsonp 完美搭配。但是，当我们以上述方式调用时，我们在浏览器 (Chrome) 的 Javascript 控制台中出现以下错误：

XMLHttpRequest 无法加载 http://localhost:8080/demoApp/service/users。请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin http://localhost:63342 因此不允许访问。

请帮帮我...

问候，

Jayanta P.

【问题讨论】：

您应该在服务器tostring.it/2014/03/04/how-to-use-CORS-with-ASPNET-WebAPI-2上为您的客户端域允许CORS
$resource 接受使用冒号作为参数。你应该用 \\: 转义冒号
由于您的客户端和服务器不在同一个地方运行，因此现代 Web 浏览器实现了 CORS。您确定在服务器端的正确位置应用response.setHeader("Access-Control-Allow-Origin", *);？
我使用了这个预建的过滤器：software.dzhuvinov.com/cors-filter.html。好消息是，如果您使用它，它也可以通过 Maven 获得。快速设置，我还没有遇到任何问题。

标签： java angularjs rest cors

【解决方案1】：

非常有帮助。这段摘录：

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

效果很好；但是，我不得不使用 Chrome 中可用的 CORS 插件禁用我的 Chrome 浏览器的安全标志。之后，我就可以无缝地从我的 angularjs 应用程序中进行安静的调用。

【讨论】：

【解决方案2】：

你尝试过这样的事情吗？

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

【讨论】：