为什么会发生AJAX跨域

1.浏览器限制
2.跨域：协议域名端口
3.XHR（xmlhttprequest）请求才会报跨域问题

同时满足以上3點才会产生跨域安全问题

解決思路

使用jsonp

原因：不使用XHR（xmlhttprequest）请求

前端代码

$.ajax({
	    	url : interfaceUrl,
	        type : "get",
	        dataType : "jsonp",
	        data : paramObj,
	        jsonp: "callbackparam",
	        jsonpCallback: "success_jsonpCallback",
	        success : function(result) {
	        ……
	        }

后端代码

@GetMapping(value = "/map", produces = {"application/javascript;charset=UTF-8"})
    @ResponseBody
    @ApiOperation("根据用户id查询轨迹图")
    public String getTrackMap(@RequestParam(value = "callbackparam") String callback) {
        String str = "……";
        return callback + "(" + str + ")";
    }

这里要注意两点，

1.produces = {“application/javascript;charset=UTF-8”}

返回类型为javascript

2.return callback + “(” + str + “)”

获取前端传递的callback参数并拼接需要给前端的数据

结果

可以通过在ajax中在控制台打印"result"参数来观察获取的数据！

ITPub博客

spring后台和jsonp解决跨域问题

为什么会发生AJAX跨域

解決思路

使用jsonp

前端代码

后端代码

1.produces = {“application/javascript;charset=UTF-8”}

2.return callback + “(” + str + “)”

结果

最新文章