1、什么是跨域
当请求不同域名下的资源时,就会产生跨域请求问题。
2、跨域请求的产生的原因
浏览器的同源策略造成了跨域问题(同源策略严格限制不同域名下的文档、脚本之间的交互)。
3、JSONP原理
首先,在客户端注册一个callback (如:'jsoncallback'), 然后把callback的名字(如:jsonp1236827957501)传给服务器。
注意:服务端得到callback的数值后,要用jsonp1236827957501(......)把将要输出的json内容包括起来,此时,
服务器生成 json 数据才能被客户端正确接收。
然后,以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数 'jsoncallback'的值 jsonp1236827957501 .
最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端, 客户端浏览器,解析script标签,
并执行返回的 javascript 文档,此时javascript文档数据,作为参数,
传入到了客户端预先定义好的 callback 函数(如上例中jquery $.ajax()方法封装的的success: function (json))里.(动态执行回调函数)
4、跨域问题如何解决
现在基于前端Jquery中的ajax方法和后台的SpringMVC框架做一个简要的说明
前端的代码:
<script> function test() { $.ajax({ url:"../../login/getCash.do", type:"get", jsonp:"callback", async: false, jsonpCallback:"fun1", dataType:"jsonp", success:function(data) {
//回调方法
//data是服务器端返回的数据 }, error:function(){ } }); } //这个是本地自定义的回调函数,可以省略,直接在ajax的回调方法里实现业务逻辑 function fun1(fun) { alert(fun); } </script>
后台代码:
@RequestMapping(value="/getCash.do") @ResponseBody public void getAcccountJsonP(HttpServletRequest request, HttpServletResponse res, String callback) { Result result = this.getResult(); Map<String, Long> mm = null; try { if (StringUtils.isNoneEmpty(callback)) { result = externService.getAccountInfo(result, 2);//result.getUserInfo().getUserId()); mm = result.getData(); } else { //do nothing callback = "unknow"; } //设置返回格式 res.setContentType("text/plain"); res.getWriter().write(callback + "("+JSONObject.toJSONString(mm)+")"); }catch(Exception e) { result = this.error(result, e); }finally { this.send(result); } }
本人才疏学浅,如有纰漏多多指教!
@飞不高的鹰