为什么要用jsonp?
由于同源策略,大致理解就是http://www.aa.com不能和http://www.bb.com进行数据沟通。
例如:
$.ajax({ url:“http://www.google.com/search?q=jquery“,success:function(json){ alert(json.count) } });
上面的代码是向谷歌发送一个搜索请求,关键字是JQuery,将处理后的结果返回到我自己的服务器上面来,很显然是不能实现的。
什么是jsonp?
JSONP(JSON with Padding)是Json的一种“使用模式”,用于解决浏览器跨域数据访问问题。
jsonp原理?
从远程服务器引入js脚本是可行的,不受同源策略的影响。
jsonp获取远程服务器数据流程
如图,在本地上的一个jsp页面中,加入了<script>标签,并指定了要访问的接口并传递了参数callback,http://server.example.com/Users/1234?callback=parseResponse,这个URL请求会进行处理,返回json数据。
例如远程服务器servlet中这样生成js脚本:
protectedvoiddoGet(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{ //接收参数,根据条件获取JSON数据 StringjsonData=getDataAsJson(req.getParameter("symbol")); //获取回调函数名 Stringcallback=req.getParameter("callback"); //拼接动态JS代码 Stringoutput=callback+"("+jsonData+"); resp.setContentType("text/javascript"); PrintWriterout=resp.getWriter(); out.println(output); //输出为jsonpFunc({"symbol":"IBM","price":"91.42"}); }
然后将js脚本加载到本地的jsp页面中。
执行下面的回调函数,处理返回的json数据。
varparseResponse=function(data){ alert(data.result); };