springboot 和vue前后端分离 跨域配置

  • Post author:
  • Post category:vue

全局跨域配置

package com.eaos.util.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;  
  
/**配置全局跨域
 * @author SMILE
 */
@Configuration
public class CorsConfig {  
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();  
        corsConfiguration.addAllowedOrigin("*"); // 1允许任何域名使用
        corsConfiguration.addAllowedHeader("*"); // 2允许任何头
        corsConfiguration.addAllowedMethod("*"); // 3允许任何方法(post、get等) 
        return corsConfiguration;  
    }
  
    @Bean  
    public CorsFilter corsFilter() {  
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();  
        source.registerCorsConfiguration("/**", buildConfig()); // 4  //注册
        return new CorsFilter(source);  
    }  
}

配置前后端资源共享

session一致等
package com.eaos.util.filter;

import org.springframework.stereotype.Component;
import org.springframework.web.servlet.HandlerInterceptor;
import javax.servlet.http.*;

/**
 * 跨域保持session一致
 * 
 * @author ASUS
 *
 */
@Component
public class FilterConfig implements HandlerInterceptor {

	public void afterCompletion(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, Exception arg3)
			throws Exception {
	}

	public void postHandle(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2) throws Exception {
	}

	public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object arg2) throws Exception {
		response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
		response.setHeader("Access-Control-Allow-Methods", "*");
		response.setHeader("Access-Control-Allow-Credentials", "true");
		response.setHeader("Access-Control-Allow-Headers",
				"Authorization,token,Origin, X-Requested-With, Content-Type, Accept,Access-Token");// Origin,
																									// X-Requested-With,
																									// Content-Type,
																									// Accept,Access-Token
		response.setHeader("Access-Control-Max-Age", "3600");
		return true;
	}
}

  1. 注册
package com.eaos.util.filter;

import java.util.ArrayList;
import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.boot.SpringBootConfiguration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

import com.eaos.util.same.SameUrlDataInterceptor;

/**
 * 跨域保持session一致
 * 
 * @author ASUS
 *
 */
@SuppressWarnings("deprecation")
@SpringBootConfiguration
public class SpringMVCConfig extends WebMvcConfigurerAdapter {

	@Autowired
	private FilterConfig filterConfig;
	public void addInterceptors(InterceptorRegistry registry) {
		//跨域资源共享
		registry.addInterceptor(filterConfig).addPathPatterns("/**");
	}


}

vue前端配置

在axios配置文件里面配置
主要配置withCredentials = true; 或者withCredentials = false;自己测试

axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded';
//跨域
axios.defaults.withCredentials = true;

版权声明:本文为qq_27865749原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。