访问纽约时报API和维基媒体API之间的区别?

时间:2016-03-27 19:24:16

标签: javascript ajax xss

我目前正在学习Udacity Front-End Web Developer Nanodegree课程,而且我参加了AJAX课程。

我的项目是采取一个地址:

  • 加载纽约时报文章
  • 从Google Streetview加载背景图片
  • 从Wikipedia加载相关文章

我完成了前两个。第三个要求jsonpCORS,我的问题是:为什么?

这两个前两个调用之间有什么不同之处:

http://api.nytimes.com/svc/search/v2/articlesearch.json?q=somecity&api-key=...
http://maps.googleapis.com/maps/api/streetview?size=600x400&location=...

这个失败了?

https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&srsearch=...

注意:以上网址为:

  • 使用jQuery.getJSON()(纽约时​​报)
  • 搜索文章
  • 用作背景图片的src(Google StreetView)
  • 使用jQuery.ajax()(维基百科)
  • 搜索相关文章

来自WikiPedia尝试的错误消息是:

No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://...' is therefore not allowed access.

重申一下:维基百科试图阻止什么情况?

更新

使用的实际网址是:

  • http://api.nytimes.com/svc/search/v2/articlesearch.json?q=somecity%20somestate&api-key=...
  • http://maps.googleapis.com/maps/api/streetview?size=600x400&location=999%20main%20st,%20somecity%20somestate
  • https://en.wikipedcwodecgia.org/w/api.php?action=query&format=json&list=search&srsearch=somecity%20somestate&callback=jQuery111107555398044642061_1459988112375&_=1459988112376

1 个答案:

答案 0 :(得分:2)

我不是100%维基媒体试图在这里阻止...

同源策略是您的问题的根源,来自Web应用程序安全模型的指令要求一页(HTML文档等)中的script与另一页的来源相同,为了访问其他页面的数据。

它的字面墙使所有剧本小孩不会在网站上造成破坏和混乱。像所有伟大的城墙一样,同源政策也有两种方式:如果你有消费/使用的数据/访问/服务,你的选择受到严重限制。

一个选项是Google Maps / API选项,您可以在其中注册,获取密钥,通过身份验证绕过同源政策。

另一种选择是JSONP,其中" P"是一个包含JSON数据的函数。函数的有效负载JSON可以从不同来源的script访问,因为它作为对象提供,并进入JS全局命名空间。调用该函数会导致浏览器将返回有效负载评估为JavaScript并允许它跨越原点。

第三个选项是CORS - 跨源资源共享。它通过根据预先选择的起源列表检查发出请求的原点来克服同源策略。如果原点在列表中,则在服务器的标题响应中返回,授予访问权限。

同样,我并不完全确定为什么维基媒体使用JSONP和CORS来克服同源政策,但允许成员网站之间的访问必须成为其背后的主要驱动力。