跨域问题解决办法

问题描述

每次请求sessionID都不一致，导致无法获取登录状态

前端解决办法

全局设置携带cookie

import Axios from 'axios'
import qs from 'qs'

Axios.defaults.withCredentials = true // 带cookie
Axios.defaults.timeout = 30000 // 响应时间
Axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8' // 配置请求头
Axios.defaults.baseURL = '/xxx/api' // 配置接口地址

后端解决办法

设置过滤器

 1 package com.hikvision.seclab.web;
 2 
 3 import javax.servlet.*;
 4 import javax.servlet.annotation.WebFilter;
 5 import javax.servlet.http.HttpServletResponse;
 6 import java.io.IOException;
 7 
 8 /**
 9  * @author: 2019/9/21 16:24
10  * @since: 0.0.1-SNAPSHOT
11  * @modified By:
12  */
13 @WebFilter(urlPatterns = { "/*" }, filterName = "loginAuthFilter")
14 public class CorsFilter implements Filter {
15     @Override
16     public void init(FilterConfig filterConfig) throws ServletException {
17 
18     }
19 
20     @Override
21     public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
22         HttpServletResponse response = (HttpServletResponse) servletResponse;
23         response.setHeader("Access-Control-Allow-Origin", "http://10.xx,xx.26:8080");
24         response.setHeader("Access-Control-Allow-Credentials", "true");
25         response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
26         response.setHeader("Access-Control-Max-Age", "3600");
27         response.setHeader("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
28         response.setHeader("P3P","CP=CAO PSA OUR");
29         System.out.println("*********************************过滤器被使用**************************");
30         filterChain.doFilter(servletRequest, servletResponse);
31     }
32 
33     @Override
34     public void destroy() {
35 
36     }
37 }

View Code

前后的上下文问题导致无法携带sessionId

后端response中，指定了sessionID的路径，只有该路径下的请求才会携带sessionID到后端

前端可以使用代理，请求路径不必完全与后端请求路径一致，这就有可能前端请求不在后端指定的路径下，导致无法携带sessionID到后端。

前端设置的baseURL一定要在后端指定的路径下！！！

前端代理设置代码：

 devServer: {
    proxy: {
      '^/xxx/': {
        target: 'http://10.xx.xx.26:8082/',
        changeOrigin: true
      }
    }
  }

前端baseURL设置

import Axios from 'axios'
import qs from 'qs'

Axios.defaults.withCredentials = true // 带cookie
Axios.defaults.timeout = 30000 // 响应时间
Axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8' // 配置请求头
Axios.defaults.baseURL = '/xxx/api' // 配置接口地址