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

来源:互联网 发布:阿里云服务器开通端口 编辑:程序博客网 时间:2024/04/30 12:59

前端:

 $.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“,
    直接访问该数据地址竟然是这样的,不要方

    这里写图片描述
    如果访问时,会自动加上相应的callback,可以返回正确的数据;

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