angular.js chrome 访问控制允许来源答案

【问题标题】：angular.js chrome Access-Control-Allow-Originangular.js chrome 访问控制允许来源
【发布时间】：2012-10-01 21:24:49
【问题描述】：

我正在尝试使用 Angular.js 服务从我使用 Jersey/Spring 制作的 REST 服务中获取 JSON。

当我使用 firefox 时，它工作正常，但是当我转到 Chrome 时，我收到了消息：

XMLHttpRequest cannot load http://localhost:8080/VirtualLawyerPj/services/timeoftheday/asjson/tue. Origin http://localhost:8090 is not allowed by Access-Control-Allow-Origin.

这是我的服务代码：

angular.module('myAppServices', ['ngResource']).
factory('Time', function($resource){
    return $resource('http://localhost:port/VirtualLawyerPj/services/timeoftheday/asjson/tue',{port:":8080"}, {
        query: {method:'GET', params:{}, isArray:false}
    });
});

有人遇到过同样的问题吗？你是怎么做到的？

谢谢。

【问题讨论】：

从命令行启动 chrome 并添加 --disable-web-security 标志。 /path/to/chrome/chrome --disable-web-security。非常适合测试
它适用于测试！但是生产呢？我正在开始一个新项目，对 Angular.js 中的这个“问题”感到有点伤痕累累
不是 angular.js 的问题，而是普通浏览器和 XMLHttpRequest 的问题。它应该在生产中工作，因为你不会在本地主机上。但是我对CORS了解不多，你得等别人。
在最坏的情况下，您始终可以在服务器上代理请求。
见stackoverflow.com/questions/18053547/… => Chrome.exe --allow-file-access-from-files

标签： angularjs

【解决方案1】：

html5rocks 教程中描述了 CORS 解决方案。为我工作。

【讨论】：

这里结合AngularJS。 nils-blum-oeste.net/…

【解决方案2】：

我有一个在端口 80 上运行的 Apache 服务器和在端口 8889 上运行的 REST Web 服务，同一台服务器。我尝试了这个解决方案，但没有奏效：

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

我想出让它工作的唯一方法是：

关于 services.js 文件：
angular.module('mirthServices', ['ngResource'])。工厂（'Cs'，功能（$资源）{ return $resource('http://localhost/rest/cs/id/:csId'); });
在 apache proxy.conf 文件中：
ProxyPass /rest http://localhost:8889/REST ProxyPassReverse /rest http://localhost:8889/REST

【讨论】：

我解决了修改服务器响应的问题，但当然，您还需要控制网络服务。我添加了 Access-Control-Allow-Origin: * 标头。

【解决方案3】：

我自己还在学习 Angular，但是使用 $location 服务来获取当前的 url 主机和端口可以让在环境之间移动代码时变得更容易。顺便说一句，这也帮助我克服了你描述的问题。

angular.module('myAppServices', ['ngResource']).
factory('Time', ['$location', function($location) {
  var url = 'http://:host::port/VirtualLawyerPj/services/timeoftheday/asjson/tue';
  var params = {
    host: $location.host(),
    port: $location.port()
  };
  var actions = {
    query: {method:'GET', isArray:false}
  };
  return $resource(url, params, actions);
}])

【讨论】：

【解决方案4】：

我通过更改 httpd.conf 文件中的 apache 解决了这个问题：

....
<Directory>
    .....
    Header set Access-Control-Allow-Origin "*"
</Directory>

我添加了行标题集，希望这对某人有所帮助

【讨论】：