ajax中jsonp跨域，回調成功但是進入error方法中

首先你要確定什麼是跨域

https://blog.csdn.net/u014727260/article/details/72793459

附上前端代碼

    var data = {
        "username":"123",
        "password":"456"
    }
    $.ajax({
        url: "http://localhost:9091/xxx/saveInfo",
        type: "GET",
        dataType: "jsonp",
        jsonp: "callback",
        jsonpCallback:"message" ,
        data: data,
        success:function(data){
        console.log(data.name);
        },
        error:function(data){
        console.log(data);
        }
    })

附上後臺代碼

    @RequestMapping(value = "/saveInfo",method = RequestMethod.GET)
    @ResponseBody
    public String saveInfo(HttpServletRequest request) {
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        System.out.println(username+"---------"+password);

        Map<String, String> map = new HashMap();
        map.put("name", "124");
        return JSON.toJSONString(map)；
    }

這是剛開始寫的api，但是無論怎麼調用，在前端接受回調數據的時候都會進入error()當中。

 

後端代碼稍作修改之後:

    @RequestMapping(value = "/saveInfo",method = RequestMethod.GET)
    @ResponseBody
    public String saveInfo(HttpServletRequest request) {
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        System.out.println(username+"---------"+password);

        Map<String, String> map = new HashMap();
        map.put("name", "124");
        String callback = request.getParameter("callback");
        String result = callback + "(" + JSON.toJSONString(map) + ")";
        return result;
    }

 這裏需要將回調函數的名字作爲方法名，而調用接口返回的內容作爲參數的方式進行拼接返回。

這裏注意，使用dataType使用jsonp，返回數據的格式，是json{"name":"123"}還是text{"hello world!"}由你自己在後臺返回數據的時候自行定義。

當選擇dataType爲jsonp的時候，type只能爲GET，這也是jsonp跨域請求爲什麼不安全，所以使用jsonp來實現跨域需要謹慎。