如何在既没有 CORS 也没有 JSONP 的来源的网页上使用 JSON？

发布于 2024-12-21 17:34:41 字数 493 浏览 3 评论 0原文

Internet 上的一些 JSON 数据服务被设计为仅由服务器使用，而忽略了由纯 Web 应用程序直接使用的可能性。

由于跨站点问题，如果此类服务提供 JSONP 格式或启用 CORS 支持。

我想制作一个 JavaScript 小工具，可以调用仅返回 JSON 的在线资源，而不返回 .

一个示例案例是我正在制作的一个单页应用程序，我能找到的唯一数据源没有提供 CORS 或 JSONP。作为一个单页应用程序，它没有自己的服务器，因此受到同源策略的约束。

在这种情况下有哪些策略可用？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

看轻我的陪伴 2024-12-28 17:34:41

**一种方法是找到一个可以访问 JSON 数据源的代理，然后将其提供给已转换为使用 JSON、CORS 或您可以处理的任何其他格式，而无需担心跨站点问题。

此类代理之一是雅虎的“YQL”。

YQL 同时支持 JSONP 和 CORS。

因此，如果您的浏览器也支持 CORS，您可以将其视为免费的 JSON 到 JSON 代理服务器。如果没有，那么它也是一个免费的 JSON 到 JSONP 代理：

这是我如何将它与 jQuery 一起使用的示例：

$.getJSON("http://query.yahooapis.com/v1/public/yql",
  {
    q:      "select * from json where url=\"http://airportcode.riobard.com/airport/" + code + "?fmt=JSON\"",
    callback: gotJSON, // you don't even need this line if your browser supports CORS
    format: "json"
  },
  function(data){
    if (data.query.results) {
      /* do something with
        data.query.results.json.code
        data.query.results.json.name
        data.query.results.json.location
      */
    } else {
      /* no info for this code */
    }
  }
);

还有一个jsfiddle 上的版本...

**One way is to find a proxy that can access a JSON data source and then serve it to your web app transformed to work with JSON, CORS, or any other format that you can handle without worrying about cross-site concerns.

One such proxy is Yahoo's "YQL".

YQL supports both JSONP and CORS.

So if your browser also supports CORS you can think of it as a free JSON to JSON proxy server. If not, then it is also a free JSON to JSONP proxy:

Here's an example of how I used it with jQuery:

$.getJSON("http://query.yahooapis.com/v1/public/yql",
  {
    q:      "select * from json where url=\"http://airportcode.riobard.com/airport/" + code + "?fmt=JSON\"",
    callback: gotJSON, // you don't even need this line if your browser supports CORS
    format: "json"
  },
  function(data){
    if (data.query.results) {
      /* do something with
        data.query.results.json.code
        data.query.results.json.name
        data.query.results.json.location
      */
    } else {
      /* no info for this code */
    }
  }
);

And a version on jsfiddle...

回复收藏 0 原文

~没有更多了~