理解JSONP

1.AJAX

ajax是基于XMLHttpRequest 的，是不能跨域的。

request = new XMLHttpRequest();request.onreadystatechange = function () {    /*表示XMLHttpRequest对象的状态：0：未初始化。对象已创建，未调用open；     1：open方法成功调用，但Send方法未调用；     2：send方法已经调用，尚未开始接受数据；     3：正在接受数据。Http响应头信息已经接受，但尚未接收完成；     4：完成，即响应数据接受完成。*/    if (request.readyState == 4) {        if (request.status == 200) {            console.info(request.responseType);            console.info(request.responseXML);            console.info(request.responseText);            //alert(request.responseXML);        }    }    if (request.readyState == 0) {        console.info("未初始化。对象已创建，未调用open");    }    if (request.readyState == 1) {        console.info("send方法已经调用，尚未开始接受数据");    }    if (request.readyState == 3) {        console.info("正在接受数据。Http响应头信息已经接受，但尚未接收完成")    }};var url = "http://localhost:8080/apphealthcheckstatus.jsp";//可以选择同步还是异步request.open("GET", url, true);request.send(null);

2.JSONP

ajax请求不能跨域，但是script可以跨域。只是返回的数据只能当作是js代码执行。所以JSONP的思想就是通过动态构造script标签跨域请求，其返回的数据一般是js的函数调用。如：

//script标签解决跨域问题//src:url(跨域地址)?参数列表n=值n&callback=callbackMethodfunction callbackMethod(data){    console.info(data);}function createScript(src) {    var element = document.createElement("script");    element.src = src;    element.language = "javascript";    element.type = "text/javascript";    document.head.appendChild(element);}createScript("http://abc.beta1.fn:8080/apphealthcheckstatus.jsp?callback=callbackMethod");

通常我们的请求调用返回值是这样的callbackMethod(参数1，参数2），callbackMethod是通过callback参数传递给后端服务的，callback参数不是固定的，是自己定义的，只要后端服务能识别，名字可以随便起。