Ajax + jsonp 前后台实现

域名不同 或者 域名相同端口不同 都算是跨域请求，js出于对安全考虑不支持跨域请求。我们可以使用JSONP解决跨域问题。

1.jsonp只能使用get请求，解决同源问题，返回javascript代码，因为请求javascript文件是没有同源问题的。

2.当请求数据类型为jsonp时，会将callback=jsonpCallback（自定义函数名称）加在url上，http://127.0.0.1:9999/TestController/testJson?callback=jsonpCallback

3.前台javascript中定义jsonpCallback函数，此函数必须定义在window下，也就是全局的函数，否则找不到。

4.后台获取请求的callback参数值jsonpCallback，返回字符串"jsonpCallback(result)"，result为返回结果。

5.请求返回的是script 代码，首先会调用jsonpCallback自定义函数，不管是否找到该函数，都会调用success函数。

方式一：

前台代码：

$.ajax({
    url: 'http://127.0.0.1:9999/TestController/testJson',
    type: "get",
    async:false,
    data: {},
    dataType: 'jsonp', //这里为jsonp类型
    jsonp: 'callback', // get请求携带的参数名称，
    jsonpCallback: 'login', //自定义回调函数名称，可以不写Jqery有默认的函数名称
    success: function(json){
        alert(json);
        var datastr = eval("("+json+")");
        alert(datastr.name);
        alert(datastr.age);
    },
    error : function() {
        alert("异常！");
    }
});

后台代码：

@RestController
@RequestMapping("TestController")
public class AccessController {  

   @GetMapping(value="testJson")
   public String testJson(String callback){
      String message = "{\"name\":\"张三\",\"age\":\"30\"}";
      String json = JSON.toJSONString(message);
      String result = callback + "(" + json + ");";
      return result;
   }
}

方式二

前台代码：

$.ajax({
    url: 'http://127.0.0.1:9999/TestController/testJson',
    type: "get",
    async:false,
    data: {},
    dataType: 'jsonp',
    jsonp: 'callback',
    jsonpCallback: 'login',
    success: function(json){
        alert(json.data);
        alert(json.retCode);
        if(!json.status){
            alert(json.msg);
        }
    },
    error : function() {
        alert("异常！");
    }
});

后台代码

包装返回值的类为      com.fasterxml.jackson.databind.util.JSONPObject;

@RestController
@RequestMapping("TestController")
public class AccessController {

    @GetMapping(value="testJson")
    public JSONPObject testJson(String callback){
        //构造函数参数分别为 status, retCode, msg, data
        ReturnData ReturnData = new ReturnData(true, 0, "请求成功", null);
        JSONPObject jsonobj = new JSONPObject(callback, ReturnData); 
        return jsonobj;
    }
}