前后端分离开发跨域问题

一、问题

前后端分离开发的时候会有跨域问题的出现:


XMLHttpRequest cannot load http://localhost:8080/user/get_user_info.do. The 'Access-Control-Allow-Origin' header has a value 'http://localhost:8080' that is not equal to the supplied origin. Origin 'http://localhost:8088' is therefore not allowed access.

原因就是IP,端口不一致,而后端不允许访问。

二、解决

解决方法就是在后端进行处理,接受前端服务器IP地址发出的请求。

这就需要我们在后端Filter里面拦截请求,并且匹配前端传来的地址和我们允许的地址,匹配成功后就可以访问后端接口了:

public class SessionExpireFilter implements Filter {
	//从配置文件中读取允许的域
    private static String[] projectAllowOriginUrl = StringUtils.split(PropertiesUtil.getProperty("projectAllowOriginUrl"),",");
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
    }

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        HttpServletRequest httpServletRequest = (HttpServletRequest)servletRequest;
        HttpServletResponse httpResponse = (HttpServletResponse) servletResponse;

        String refer = httpServletRequest.getHeader("Referer");
        String originHeader = httpServletRequest.getHeader("Origin");
        if (StringUtils.isEmpty(refer) && StringUtils.isEmpty(originHeader)) {
            filterChain.doFilter(servletRequest,servletResponse);
            return;
        }
        URL url = new URL(refer == null ? originHeader : refer);
        StringBuffer origin = new StringBuffer();
		//获取传来的域名
        origin.append(url.getProtocol()).append("://").append(url.getHost());
        if (url.getPort() != -1) {
            origin.append(":").append(url.getPort());
        }
        // 遍历配置文件中允许的域,判断是否可以放行
        boolean allow = false;
        for (String tmpOrigin : projectAllowOriginUrl) {
            if (StringUtils.equals(tmpOrigin, origin.toString())) {//传来的域和配置文件中的域之一匹配
                allow = true;
            }
        }
        if (allow) {
            httpResponse.setHeader("Access-Control-Allow-Origin", origin.toString());
        } else {
            httpResponse.setHeader("Access-Control-Allow-Origin", "http://localhost:8080");
        }
        httpResponse.setHeader("Access-Control-Allow-Headers","Origin, X-Requested-With, Content-Type, Accept");
        httpResponse.setHeader("Access-Control-Allow-Credentials", "true");

        filterChain.doFilter(servletRequest,servletResponse);
    }

    @Override
    public void destroy() {
    }
}

上面projectAllowOriginUrl是我在配置文件中配置的地址

projectAllowOriginUrl=http://localhost:8088,http://localhost:8077
这样问题就解决了。


猜你喜欢

转载自blog.csdn.net/weixin_40459875/article/details/80330084