笔者最近的项目中出现了Ajax跨域请求失败的问题,一开始希望通过
第一种方法:callback
js:
var phone = "18321618669"; var _url2 = "http://127.0.0.1:8080/activity/zombiePotions.ctrl?mobilePhone="+phone; $.ajax({
url:_url3, dataType: 'jsonp', jsonp:'callback', jsonpCallback:"successCallback", type:'get', success: function(data) { alert(data.data); }, error:function(data){ alert("error"); } }); 后台代码: @RequestMapping("/zombiePotions.ctrl") public String getZombieRunningPotions(String mobilePhone){ Map<String, Object> returnResult = new HashMap<String, Object>(); JSONObject aapJson = new JSONObject(); aapJson.put("data", returnResult); return "successCallback("+aapJson+")"; }
第二种方法:直接在controller上加注解
@CrossOrigin(origins = "*", maxAge = 3600)
js按照正常的get请求发送,不需要设置返回函数
maxAge就是http头中的Access-Control-Max-Age
Access-Control-Max-Age 这个响应首部表示 preflight request (预检请求)的返回结果(即 Access-Control-Allow-Methods 和Access-Control-Allow-Headers 提供的信息) 可以被缓存多久。
用法:
Access-Control-Max-Age: <delta-seconds>
返回结果可以用于缓存的最长时间,单位是秒。在Firefox中,上限是24小时 (即86400秒),而在Chromium 中则是10分钟(即600秒)。Chromium 同时规定了一个默认值 5 秒。
如果值为 -1,则表示禁用缓存,每一次请求都需要提供预检请求,即用OPTIONS请求进行检测(即preflight请求-options)。
注:需要注意的是Access-Control-Max-Age的设置针对完全一样的url,如果url加上路径参数,其中一个url的Access-Control-Max-Age设置对另一个url没有效果!!!