今天,因为项目的需要,研究了一下JSONP,特在此记录一下 ,希望可以帮助那些有疑惑的朋友们,本人也是刚学,高手略过即可。
关于Jsonp的定义就不说了,网上一片,大家可以自己查询。我就在此直接进入正题。
首先,服务器端,我是用的.net 搭建的。下面是代码;
public class LinyangController : Controller { // // GET: /Linyang/ public ActionResult Index() { Person person = new Person(); person.age = 23; person.name = "linyang"; String p= JsonConvert.SerializeObject(person); //前天需要获取的json数据 String callback = Request.QueryString["callback"].ToString(); //获取到URL中传递过来的callback中的值 return Content(callback+"("+p+");"); //将获取的值同json数据拼接起来,中间以括号连接。格式:callback中的值+左括号+json数据+右括号。 } }
简单的利用asp.net mvc 框架写的一个action。然后放到服务器上去。具体的解释,咱们待会再说。
客户端,用JSP充当的。利用了Jquery 或 Kissy(淘宝创造的JS框架,超级好用) 发起Ajax 跨域请求。
下面是,客户端代码:
<%-- Created by IntelliJ IDEA. User: Administrator Date: 2014/12/22 Time: 21:27 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %>我是首页 <%----%>
大家可以看到,引入了两个脚本,一个是Jquary,另一个就是Kissy的,经测试,都能用,大家可以试一下。
现在可以具体的说一下了,咱们以Jquary为例,当你dataType声明为jsonp时,在请求的连接口面自动加上callback,当然这个参数名可以自己定义,就是通过jsonp这个属性来定义,这个名字,并不是没有意义的。请大家,注意这段代码:
String callback = Request.QueryString["callback"].ToString();
这是在服务器端,获取参数callback中的值,所以,前端定义的传递的是什么参数,后台就得是什么参数来获取。后台获取之后,放到返回的数据中,作为一个返回数据的“函数名”,前台就可以获取这个“函数名”,从来调用某个具体的函数来处理返回的数据,当然,如果前台不指定函数名,那么Jquary会默认加上一个,就可以使用success,来接受返回的数据。我上面就采用这种方式实现的。
PS:刚开始,一直获取不到,原来是
Content(callback+"("+p+");");
没有加左右括号,也再起提醒一下大家。