JSONP,是啥?
JSON with Padding是JSON的一种“使用模式”
何为跨域?
同源策略是由Netscape提出的的一个著名的安全策略,现在所有支持javascript的浏览器都会使用这个策略,所谓同源就是指,域名、协议、端口号 相同,当在一个浏览器打开两个网站的页面时,某一个网站在执行js脚本时会检查访问的资源是否属于本域范围,只有本域范围内的资源才能被访问。否则,称之为跨域。
如何实现跨域,先说说html中的script?
- html标签的src属性没有同源限制(支持跨域),浏览器解析script标签时,会自动下载src属性值(url)指向的资源。
- script标签指向的资源文件被下载后,其中的内容会被立即执行;
- 服务器端的程序会解析src属性值中的url传递的参数,根据这些参数针对性返回一个/多个函数调用表达式,这些函数调用表达式的参数就是客户端跨域想得到的数据
- 服务器生成、返回的文件中,表达式调用的函数是已经在本地提前定义好的,而参数就是希望从跨域服务器拿到的数据
JSONP跨域的原理
就是利用<script>标签没有跨域限制的“漏洞”来达到与第三方通讯的目的。
- 当需要通讯时,本站脚本创建一个<script>元素,地址指向第三方的API网址,形如:<script src="http://www.example.net/api?param1=1¶m2=2"></script> 并提供一个回调函数来接收数据。
- 第三方产生的响应为json数据的包装(故称之为jsonp,即json padding),形如callback({"name":"hax","gender":"Male"}) 、
- 浏览器会调用callback函数,并传递解析后json对象作为参数。本站脚本可在callback函数里处理所传入的数据。