jQuery+Ajax+jsonp+java实现跨域访问

前端:

 $.ajax({
            type:"GET",
            url:"http://www.deardull.com:9090/getMySeat", //访问的链接
            dataType:"jsonp",  //数据格式设置为jsonp
            jsonp:"callback",  //Jquery生成验证参数的名称
            success:function(data){  //成功的回调函数
                alert(data);
            },
            error: function (e) {
                alert("error");
            }
        });

后端:

 @ResponseBody
    @RequestMapping("/getMySeat")
    public String getMySeatSuccess(@RequestParam("callback") String callback){
        Gson gson=new Gson();
        Map<String,String> map=new HashMap<>();
        map.put("seat","1_2_06_12");
        logger.info(callback);
        return callback+"("+gson.toJson(map)+")";
    }

注意:

  • 使用jsonp时,跨域请求只能是get请求,不能为post,即“type:GET”;
  • url不带类似“?callback=’aaa’”的字符串,如例子中的 url:”http://www.deardull.com:9090/getMySeat“,
    直接访问该数据地址竟然是这样的,不要方

    jQuery+Ajax+jsonp+java实现跨域访问_第1张图片
    如果访问时,会自动加上相应的callback,可以返回正确的数据;

  • 前端注意与后端沟通约定jsonp的值,通常默认都是用callback。
  • 后端根据jsonp参数名获取到参数后要与本来要返回的json数据按“callback(json)”的方式构造。
  • 如果要测试的话记得在跨域环境(两台机器)下进行。
    参考链接:
    jQuery jsonp跨域请求
    Java+jquery+jsonp实现跨域

你可能感兴趣的:(ajax)