如何配置角度$资源(ngResource)从使用CORS另一个域提取数据 [英] How to configure Angular $resource (ngResource) to pull data from another domain using CORS
问题描述
我希望能够利用CORS来请求我的数据使用$资源设置的资源。我有CORS与$ HTTP,但相同的技术并不适用于$资源工作,我希望有人能来我的救援,并告诉我如何与$资源。
I'd like to be able to setup resources using $resource using CORS to request my data. I've got CORS working with $http but the same techniques don't apply to $resource and I was hoping someone can come to my rescue and show me how with $resource.
我修改了角教程的最后一步黑客的phonecatServices使用CORS服务,在services.js文件。
I've modified the last step of the Angular tutorial to use CORS by hacking the phonecatServices service, in the services.js file.
我发现这个例子它使用$ http.defaults.useXDomain = TRUE;删除$ http.defaults.headers.common ['X-要求-随着'];一线得到利用的角度CORS请求数据,但如果我尝试$ resource.defaults.useXDomain = TRUE;我得到的错误:无法设置属性useXDomain未定义。
I found this example which uses the $http.defaults.useXDomain = true; delete $http.defaults.headers.common['X-Requested-With'];line to get angular to request the data using CORS but if I try $resource.defaults.useXDomain = true; I get the error: "Cannot set property 'useXDomain' of undefined".
我presume $资源没有这个属性,所以我的问题是,我该如何配置资源$使使用CORS跨域资源请求。
I presume $resource doesn't have this property, so my question is, how do I configure $resource to make cross domain resource requests using CORS.
下面是我的code:
angular.module('phonecatServices', ['ngResource']).
factory('Phone', function($resource){
return $resource('http\\://localhost\\:8080/:phoneId.json', {}, {
query: {params:{phoneId:'phones'}, isArray:true}
});
});
我收到以下错误,当我尝试提出请求:对象#<资源与GT;没有方法推
I get the following error when I try to make the request: Object #<Resource> has no method 'push'
修改
我试过设置为$ http和它工作的大部分时间,但是当调用的资源查询制成,在这种情况下Phone.get(phoneId);这似乎抛出上述错误。
I've tried setting up for $http and it works most of the time, but when the call is made to the resource query, in this case Phone.get(phoneId); this seems to throw the above error.
调用code,我怀疑导致错误(从controllers.js 步骤11角教程)
Calling code that I suspect is causing the error (from controllers.js step 11 angular tutorial):
function PhoneDetailCtrl($scope, $routeParams, Phone) {
$scope.phone = Phone.get({phoneId: $routeParams.phoneId}, function(phone) {
$scope.mainImageUrl = phone.images[0];
});
$scope.setImage = function(imageUrl) {
$scope.mainImageUrl = imageUrl;
}
}
如果我删除code运行正常上述方法的内部结构(未取得该网站的图片),但我不明白为什么这是行不通的?我已经设置了$ HTTP服务使用CORS所以应该把它传递给显然$资源。
If I remove the innards of the above method the code runs fine (without obtaining the image for the website), but I don't understand why this wouldn't work? I have set up the $http service to use CORS so that should pass it to $resource apparently.
任何人都可以阐明它的光? (任何工作示例code将大大AP preciated)。
Can anyone shed any light on it? (any working example code would be greatly appreciated).
编辑:13/08/13
13/08/13
只是让任何人参观了这个问题所知,没有一个答案下面确实回答了这个问题,我研究了自己的答案,但如果有人察觉这一点,并有一个答案,我会非常AP preciate依然。
Just so anyone visiting this question is aware, none of the answers below have really answered the question, I am researching an answer myself but if anyone spots this and has an answer I'd greatly appreciate it still.
编辑:13年6月9日
目前正在研究这个项目,似乎让我在寻找的一切: https://github.com/ jpillora / xdomain
Currently looking into this project, seems to allow everything I'm looking for: https://github.com/jpillora/xdomain
推荐答案
OK,我发现我的项目的解决方案是xdomain:的 https://github.com/jpillora/xdomain
OK, the solution I've found for my project is xdomain: https://github.com/jpillora/xdomain
我承认这可能不是适合每个人,但它是一个体面的跨浏览器解决方案,同时我们坚持用IE小于10,这似乎是最好的解决办法。 (我知道IE8和IE9提供部分支持,但一如既往地与IE不全面支持,我不想浪费时间做围绕另一个工作IE)。
I accept that this may not be suitable for everyone but it's a decent cross browser solution and whilst we're stuck with IE<10 this seems to be the best solution. (I am aware IE8 and IE9 provide partial support but that as always with IE isn't full support and I don't want to have to waste time doing another work around for IE).
感谢大家谁的问题提供答案。
Thanks to everyone who provided answers to the question.
这篇关于如何配置角度$资源(ngResource)从使用CORS另一个域提取数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!