0

我们目前正在尝试使用AngularJS从JsonStub获取 Json 数据。我们尝试复制 JsonStub 的示例，但没有成功将其与我们的 apikey 一起使用。

我们只想{"message":"hello world!"}在 JsonStub 的 AngularJS 中显示。

这是我们的代码，请让我知道我们做错了。

谢谢你。

控制器

.controller('warrantyListController', function($scope, $http) {
        $http({
              url: 'http://jsonstub.com/jobs',
              method: 'GET',
              dataType: 'json', 
              data: '',         
              headers: {
                  'Content-Type': 'application/json',
                  'JsonStub-User-Key': 'xxxxx-xxxxx-xxxxx-xxxxx',
                  'JsonStub-Project-Key': 'xxxxx-xxxxx-xxxxx-xxxxx'
              }
         })
         .success(function (data, status, headers, config) {
             alert(JSON.stringify(data, null, 4));
         });
 })

JsonStub 在此处输入图像描述

4

1 回答 1

0

与它是一个跨域请求的事实有关。打开 F12 开发工具看看。

XMLHttpRequest 无法加载http://jsonstub.com/jobs。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问来源“ http://run.plnkr.co ”。响应的 HTTP 状态代码为 500。

实际修复

添加以下标题

'Access-Control-Allow-Origin': 'http://jsonstub.com'

或者，允许所有

'Access-Control-Allow-Origin': '*'


可能需要修复，具体取决于 Angular 版本

以前版本的带有 CORS 的 Angular 中存在一个已知问题，但可以通过以下配置更改来解决：

.config(function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
 })
于 2014-10-09T14:36:31.033 回答