角度简单的 JSON 请求答案

【问题标题】：Angular simple JSON request角度简单的 JSON 请求
【发布时间】：2014-01-03 08:54:35
【问题描述】：

这可能会让我看起来像一个完全的初学者，而我在角度方面也是如此，但这是我的问题：

我正在尝试向 .JSON api 发出一个简单的请求，但我只是不断收到错误状态代码 0。

var dataUrl = 'http://www.reddit.com/r/pics/comments/1ua1nb/.json?limit=2';

$http({method: 'GET', url: dataUrl}).
    success(function(data, status, headers, config)
    {
        window.alert('success:' + status);
    }).
    error(function(data, status, headers, config) {
        window.alert('error:' + status);
    });

更新：

我通过浏览器检查了 javascript 控制台并收到以下错误消息：

event.returnValue 已弃用。请改用标准 event.preventDefault()。加载资源失败：服务器响应状态为 501（未实现）http://www.reddit.com/r/pics/comments/1ua1nb/.json?limit=2 加载资源失败：请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin ... 因此不允许访问。 http://www.reddit.com/r/pics/comments/1ua1nb/.json?limit=2 XMLHttpRequest 无法加载 http://www.reddit.com/r/pics/comments/1ua1nb/.json?limit=2。请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin ...因此不允许访问。

【问题讨论】：

你浏览器中的 JavaScript 错误控制台是怎么说的？
如何检查？我刚刚尝试了警报（状态），这给了我 0 我猜是未定义的..
取决于您的浏览器。您在哪些浏览器中进行测试？
Chrome 是我使用的浏览器
查看 → 开发者 → JavaScript 控制台

标签： javascript json angularjs httprequest

【解决方案1】：

您正在尝试执行跨域请求。这是浏览器禁止的（它只会让您向与最初加载页面的域相同的域发出请求）。这不是特定于 Angular，而只是一般的 ajax 请求。

你可以在这里阅读：

http://en.wikipedia.org/wiki/Same-origin_policy

有几种方法可以绕过它，例如 JSONP 和 CORS。两者都需要服务器端支持。您必须查看您正在调用的服务，看看它可能支持哪个服务。

您可以在此处阅读有关如何执行 JSONP 请求的信息：

http://docs.angularjs.org/api/ng.$http

【讨论】：

虽然 reddit 的响应有 access-control-allow-origin:* 标头
你是对的，但肯定有什么东西干扰了他的标题（可能是一些奇怪的代理）。它在这里工作：plnkr.co/edit/sF3MXrgouCqb9AosNAe4?p=preview

【解决方案2】：

您不能访问其他网站上的资源。

你需要使用jsonp。

这是你的一个未经测试的修改代码，请尝试看看它是否工作：

var dataUrl = 'http://www.reddit.com/r/pics/comments/1ua1nb/.json?jsonp=JSON_CALLBACK&limit=2';

$http.jsonp(dataUrl).
    success(function(data, status, headers, config)
    {
        window.alert('success:' + status);
    }).
    error(function(data, status, headers, config) {
        window.alert('error:' + status);
    });

【讨论】：