分析
- 打开控制台发现会有这条错误信息:
has been blocked by CORS policy: The ‘Access-Control-Allow-Origin’ header co…
- 而直接get是有数据的,说明服务器是正常的
- 使用浏览器f12抓包发现浏览器ajax异步请求没有获取到服务器响应的JSON数据
- 带参数copy ajax异步请求的地址,直接放浏览器回车.发现成功响应了json数据
- 再使用专业一点的fiddler抓包,发现ajax异步post请求服务器是响应了json数据,而在浏览器里却没有
- 可以得出结论是浏览器屏蔽了服务器的响应数据
解决办法
服务器端过滤器doFilter()里设置响应头,解决浏览器屏蔽跨域请求响应的数据问题
HttpServletResponse response = (HttpServletResponse) servletResponse;
HttpServletRequest request = (HttpServletRequest) servletRequest;
//http://xxx.xxx.xxx.xxx是你的前端地址 不是80端口有端口请设置端口http://xxx.xxx.xxx.xxx:端口号
response.setHeader("Access-Control-Allow-Origin","http://xxx.xxx.xxx.xxx");
response.setHeader("Access-Control-Allow-Credentials","true");
filterChain.doFilter(request, response);
注意
http://xxx.xxx.xxx.xxx和http://xxx.xxx.xxx.xxx:80对于浏览器来说是有区别的,如果你的前端端口是80端口,请不要在http://xxx.xxx.xxx.xxx后面添加80端口,请直接使用http://xxx.xxx.xxx.xxx
分析
- 打开控制台发现会有这条错误信息:
has been blocked by CORS policy: The ‘Access-Control-Allow-Origin’ header co…
- 而直接get是有数据的,说明服务器是正常的
- 使用浏览器f12抓包发现浏览器ajax异步请求没有获取到服务器响应的JSON数据
- 带参数copy ajax异步请求的地址,直接放浏览器回车.发现成功响应了json数据
- 再使用专业一点的fiddler抓包,发现ajax异步post请求服务器是响应了json数据,而在浏览器里却没有
- 可以得出结论是浏览器屏蔽了服务器的响应数据
解决办法
服务器端过滤器doFilter()里设置响应头,解决浏览器屏蔽跨域请求响应的数据问题
HttpServletResponse response = (HttpServletResponse) servletResponse;
HttpServletRequest request = (HttpServletRequest) servletRequest;
//http://xxx.xxx.xxx.xxx是你的前端地址 不是80端口有端口请设置端口http://xxx.xxx.xxx.xxx:端口号
response.setHeader("Access-Control-Allow-Origin","http://xxx.xxx.xxx.xxx");
response.setHeader("Access-Control-Allow-Credentials","true");
filterChain.doFilter(request, response);
注意
http://xxx.xxx.xxx.xxx和http://xxx.xxx.xxx.xxx:80对于浏览器来说是有区别的,如果你的前端端口是80端口,请不要在http://xxx.xxx.xxx.xxx后面添加80端口,请直接使用http://xxx.xxx.xxx.xxx