Axios跨域请求配置

      React中用到的网络代理请求是axios，它在使用的过程中，会存在一些问题，今天就分享我遇到过的一些问题

1、跨域请求后台配置：

在SpringBoot项目中的，需要实现WebMvcConfigurer，并且重写addCrosMappings方法

@Configuration
public class ApplicationAutoConfiguration implements WebMvcConfigurer {
	@Override
	public void addCorsMappings(CorsRegistry registry) {
			registry.addMapping("/**").allowedOrigins("*").allowedMethods("*").
allowedHeaders("*").allowCredentials(true);
	}
}

二、请求后台中的OPTIONS方法时后台配置

      由于发送POST请求的时候会先发送一个OPTIONS的请求，但是这个OPTIONS请求中是不能和平常的Headers一样头部带上token验证信息的，当浏览器检测不到token的时候，就会被拒绝访问，所以，需要在后台做一些处理，我用的是Shiro权限认证框架，所以只需要在FormAuthenticationFilter拦截器继承的isAccessAllowed方法中判断请求的类型，返回true即可，如下图所示：

       如果是Servlet容器的，需要在preHandle方法中判断一下请求的类型。

3、跨域请求Cookie配置

       在跨域请求中，默认是不带Cookie请求信息的，所以每次请求都是不同的用户，这个时候，axios请求中，加上一个配置，就是带上Cookie等验证信息。如下图所示：