来自AngularJS的HTTP状态0获取JSON

Cor*_*wis 11 json http cors angularjs

我正在为JSON运行$ http.get并且状态为0.我已经下载了相同的JSON并且get在本地工作,而在Python中使用请求库我可以得到JSON没问题,但是AngularJS它没有用.我不明白为什么角度没有得到它,但其他一切都是.下面的代码片段.

function AgentListCtrl($scope, $http) {
  $http.get('http://foo.bar/api/objects').success(function(data) {
  $scope.objects = data;
}).error(function(data, status) {
  $scope.status1 = status;
});
Run Code Online (Sandbox Code Playgroud)

这提供了JSON并在使用本地文件时对其进行解析,但否则会失败并将status1设置为0.

h7r*_*h7r 21

只是为了明确这一点,因为上述答案并未直接说明(但在其评论中),并且像我一样,一些Angular新手可能会花一些时间在这上面:

  • Angular的$资源将能够在另一台服务器上执行REST动词,而后者将正确响应(使用a status 200).然而,Angular将失败并显示密码消息,可通过状态0识别.这进一步误导,因为在浏览器的调试器中,您实际上可能会看到服务器的答案.

  • Angular将对OPTIONS跨域请求(至少对于默认query()方法)执行请求,除非另有说明.通常服务器不会回答所需的内容(即您的表示).每个请求执行此操作的一种简单方法是指定方法'GET'.

    $resource('http://yourserver/yourentity/:id', {}, {query: {method: 'GET'});
    
    Run Code Online (Sandbox Code Playgroud)
  • 响应REST请求的服务器必须包含CORS [1]指定的头,以便允许Angular正确使用响应.实质上,这意味着Access-Control-Allow-Origin在响应中包含标头,指定允许来自请求来自的服务器.这个值可能是*.

对于将AngularJS与spring-data-rest-webmvc集成的任何人来说,补充这个答案:

  • Angular不会正确使用HATEOAS json格式化的响应,而是产生错误Expected response to contain an array but got an object.这可以通过将isArray: false参数添加到$resouce配置中来解决;

  • 在[2]中提供了为spring-data-rest-webmvc场景配置CORS的一个非常重要的示例(参见参考资料SimpleCORSFilter)

[1] https://developer.mozilla.org/en/docs/HTTP/Access_control_CORS

[2] https://spring.io/guides/gs/rest-service-cors/

  • 请注意,Angular不会自行生成OPTIONS/preflight请求.浏览器呢.事实上,Angular不了解这个请求,它对客户端代码完全透明. (3认同)

zs2*_*020 2

在您的代码中,状态分配仅在发生错误时发生。当调用成功时,您应该能够获取状态,如下所示:

success(function(data, status, headers, config) {
    $scope.objects = data;
    $scope.status1 = status;
}).error(function(data, status) {
    $scope.status1 = status;
});
Run Code Online (Sandbox Code Playgroud)