Javascript 如何使用AngularJs从不同域请求json

我正在尝试从跨域加载json文件

我试图用AngularJs为ES6编写以下内容：

  getThemesOptions() {
    const url = `http://xinruima.me/game/themes.json`;
    return this.$http.jsonp(url)
      .success(function(data){
          console.log(data);
      });
  }

这给了我一个错误：

然后我在网上找到了这个： 这是一个使用我编写的相同语法调用公共api的示例，它可以工作。

但是，当我将url更改为我的url时，会出现如上所示的错误：

我测试了我的json文件，它是有效的

---

有什么建议吗？

问题在于

http://xinruima.me/game/themes.json

URL不是一个

JSONP

响应，而是一个常规的

JSON

错误是浏览器试图将JSON响应解析为Javascript。这不会发生在您的小提琴请求上，如url

http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK

是一个有效的JSONP响应

您可以使用

$http.get

而不是

$http.jsonp

getThemesOptions() {
    const url = `http://xinruima.me/game/themes.json`;
    return this.$http.get(url)
      .success(function(data){
          console.log(data);
      });
  }

但是请求

http://xinruima.me/game/themes.json

不允许跨域请求，因此您仍然会有错误。例如，在Chrome上，您可以这样做，但这在开发过程中是很好的，如果您无法控制xinruima.me上的服务器，您将无法克服此安全限制

编辑：

---

由于

JSONP

似乎不是一个选项，您可以检查克服跨域错误的可能方法。

我完全控制xinruima.me的服务器，我应该如何克服该限制？感谢您必须添加跨域标题（

访问控制-*

），允许您的来源（此angular应用程序所在的位置/域）发出请求，以便浏览器知道这是一个安全的呼叫。查看这篇MDN CORS文章了解更多信息