【问题标题】:Angular JSON only works with local json files but not urlsAngular JSON 仅适用于本地 json 文件,但不适用于 url
【发布时间】:2015-10-05 03:06:05
【问题描述】:

我刚刚被介绍给 Angularjs,我正在尝试使用 $http.get。该页面仅在我提供的 url 是本地 'calender.json' 时才有效但是当我提供 url 时,它会吐出一个空白页面。有人可以帮我理解我的错误吗?

【问题讨论】:

  • 这是 CORS 问题,请检查您的控制台..
  • 可能需要对 COR 使用 jsonp 请求。
  • No 'Access-Control-Allow-Origin' header is present on the requested resource. 看来你要么需要调整服务器,要么使用jsonp。
  • 由于same origin policy,并非所有 API 都可以使用 ajax 访问。这个没有启用 CORS,如果它们不提供 jsonp,您将需要使用代理来获取数据。附带说明...强烈建议将角度版本升级到最新版本。自 1.02 以来很多事情都发生了变化
  • 我今天发现如果url是404,chrome有时会决定吐出跨域错误,因为找不到的页面也没有访问控制-允许来源标头。因此,检查您尝试获取的 url 是否确实存在是值得的。

标签: javascript json angularjs


【解决方案1】:

正如其他人在 cmets 中对您的问题指出的那样,这是一个 CORS 问题。要轻松解决此问题,您可以将您的 $http.get() 呼叫更改为 $http.jsonp()。然而,仅此一项并不能解决问题。您还需要通过添加另一个查询参数来调整 url(使用您提供的 url): https://ssl.uh.edu/calendar/api/?view=7day&format=json&distinct=1&callback=JSON_CALLBACK

callback=JSON_CALLBACK 告诉服务器您正在查询您希望它将 JSON 响应包装在名为 JSON_CALLBACK 的函数中,这是一个特殊的角度关键字。查看文档了解更多信息:https://docs.angularjs.org/api/ng/service/$http

tl;博士版本: 将$http.get("https://ssl.uh.edu/calendar/api/?view=7day&format=json&distinct=1") 更改为$http.jsonp("https://ssl.uh.edu/calendar/api/?view=7day&format=json&distinct=1&callback=JSON_CALLBACK")

【讨论】:

  • 很好地发现它实际上服务于 jsonp。值得注意的是,字符串 JSON_CALLBACK 只是内部创建的回调名称的占位符
  • 是的,我试图说明它很特别,但不想就此展开切线。感谢您指出这一点。
  • 我只提到它是因为几天前我看到有人试图在静态脚本文件中使用该字符串来测试 jsonp,但无法弄清楚为什么它不起作用
猜你喜欢
  • 2012-12-06
  • 2023-03-09
  • 2012-01-21
  • 2016-06-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多