您的位置:首页 > Web前端 > Vue.js

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

2019-07-14 23:37 585 查看
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/qq_27865749/article/details/95936854

全局跨域配置

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;
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: