所谓JSONP,是跨域的一种访问方式,其特点在于比较方便地运行第三方的请求会话来进行跨域。在跨域这一点上,可以说是毫无顾忌的。跨域(Cross-Domain)在网络安全眼中可不是什么客气的行为。利弊兼有之,弄不好的话既不能为第三方提供访问数据的服务,又暴露了更多的安全漏洞,严重的还会引狼入室。一般的WebService中,支持JSON的还比较少,多数采用XML文档作为答应结果的格式文档。但是我们一方面知道,结合Script标签的src的自由性,却有无比的想象空间。那么能不能理由<script src="XXX">这个自由的触手去触碰任意一个角落的WebService呢?能,,不过限定采用的格式只能是JSON格式!
既然能够可靠的跨域,那么要求变换另外一个载体格式也是情理之中的,正所谓“鱼和熊掌不可兼得”,况且JSON不一定见得凑合不上。一些WebService供应商还是愿意使用JSON作为可选格式的,这样我们的浏览器有一次变为强大的客户端了,呵呵暗笑~是不是有点单纯式的浅薄呢~。
, 与标准库的Ext.data.ScriptProxy的实现如出一辙。使用方法如例子
:
Ext.ux.JSONP.request('http://api.flickr.com/services/feeds/photos_public.gne', {
callbackKey: 'jsoncallback',
params: {
format: 'json',
tags: Ext.fly('search-value').dom.value,
tagmode: 'all',
lang: 'en-us'
},
callback: updateResults
});
这个例子是用户输入几个关键字,然后让Flicker查询相关的图片。request()方法第一个参数是WebService的地址,当前就是Flicker向公众公开的API地址。我们声明格式是params.foamt:jspon,提交的参数是params.tags的输入内容。Flicker API答应请求后,将结构返回浏览器客户端,即updateResults的函数中处理,列出查询的结果。点击图片打开例子演示。
可以说,这时候客户端就是Flicker的“马甲”,使用Flicker的服务,允许让用户自由地整合——用时下流行的Bizzword说,便是Mashup。
我们看看一个更复杂的进阶例子,演示地址在这儿
。它是有前面Ext Core的几个例子(Menu + Flickr JSONP + Carousel + Lightbox)所组成的,正是一个很好的示范例子(点击图片打开例子)。
跨域,是为“同源策略”之反动。客户端的访问权限渐松,方便了爱好浏览器编程的人,所以也就诞生了JSONP(JSON with Padding)。