用jquery.getJSON实现跨域提交

最新推荐文章于 2020-09-05 13:08:28 发布

Ami121

最新推荐文章于 2020-09-05 13:08:28 发布

阅读量2.9k

点赞数

分类专栏： javascript 文章标签： callback jsonp jquery json function javascript

本文链接：https://blog.csdn.net/ami121/article/details/5369964

版权

javascript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

需求所至，实现跨域提交登录。早就听说jquery可以通过getJSON来实现跨域获取数据，今天刚好有时间测试了一下了，例子比较简单。

引用jquery1.3的中文api

“

在 jQuery 1.2 中，您可以通过使用JSONP 形式的回调函数来加载其他网域的JSON数据，如 "myurl?callback=?"。jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。

注意：此行以后的代码将在这个回调函数执行前执行。

”

Jsonp原理：

首先在客户端注册一个callback, 然后把callback的名字传给服务器。

此时，服务器先生成 json 数据。

然后以 javascript 语法的方式，生成一个function , function 名字就是传递上来的参数 jsonp.

最后将 json 数据直接以入参的方式，放置到 function 中，这样就生成了一段 js 语法的文档，返回给客户端。

客户端浏览器，解析script标签，并执行返回的 javascript 文档，此时数据作为参数，传入到了客户端预先定义好的 callback 函数里.（动态执行回调函数）

客户端：

<mce:script src="jsfolder/jquery-1.3.2.min.js" mce_src="jsfolder/jquery-1.3.2.min.js" type="text/javascript"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> <form method="post"> <input type="text" value=""/> <input type="button" value="查询" οnclick="uLogin();"/> </form> </body>

后台用struts处理

public ActionForward findKey(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws IOException { List<String> alist=new ArrayList<String>(); alist.add(0,new String("apple")); alist.add(1,new String("pear")); JSONArray json=JSONArray.fromObject(alist); String output = request.getParameter("callback") + "(" + json + ");"; PrintWriter out = response.getWriter(); out.println(output); return null; }

String output = request.getParameter("callback") + "(" + json + ");";

这里就是jsonp原理的体现。