Request header field Content-Type is not allowed by Access-Control-Allow-Headers

https://blog.csdn.net/xuedapeng/article/details/79076704
https://blog.csdn.net/z8414/article/details/72780263

一、问题：

跨域请求中包含自定义header字段时，浏览器console报错。

Request header field xfilesize is not allowed by Access-Control-Allow-Headers

二、原因：

包含自定义header字段的跨域请求，浏览器会先向服务器发送OPTIONS请求，探测该服务器是否允许自定义的跨域字段。

如果允许，则继续实际的POST／GET正常请求，否则，返回标题所示错误。

OPTIONS请求：

Request URL:http://xxx.yyy.com/zzz/api/file/uploadFile2.do
Request Method:OPTIONS
Status Code:200 OK
Remote Address:47.92.87.25:80
Referrer Policy:no-referrer-when-downgrade

三、解决办法：

服务端需要对OPTIONS请求做出应答，应答header中包含 Access-Control-Allow-Headers，且值包含options请求中Access-Control-Request-Headers的值。

以下为java服务端filter中设置的OPTIONS请求处理代码。
 

@Override
 
public void doFilter(ServletRequest req, ServletResponse resp,
		FilterChain chain) throws IOException, ServletException {
 
	try {
 
		HttpServletRequest hreq = (HttpServletRequest) req;
 
 
 
		HttpServletResponse hresp = (HttpServletResponse) resp;
 
		//跨域
		hresp.setHeader("Access-Control-Allow-Origin", "*");
 
 
		//跨域 Header
 
		hresp.setHeader("Access-Control-Allow-Methods", "*");
 
		hresp.setHeader("Access-Control-Allow-Headers", "Content-Type,XFILENAME,XFILECATEGORY,XFILESIZE");
 
		
 
		// 浏览器是会先发一次options请求，如果请求通过，则继续发送正式的post请求
 
		// 配置options的请求返回
 
		if (hreq.getMethod().equals("OPTIONS")) {
 
			hresp.setStatus(HttpStatus.SC_OK);
 
			// hresp.setContentLength(0);
 
			hresp.getWriter().write("OPTIONS returns OK");
 
            return;
 
        }
 
		// Filter 只是链式处理，请求依然转发到目的地址。
 
		chain.doFilter(req, resp);
 
	} catch (Exception e) {
 
		e.printStackTrace();
 
	}
 

其中，这个就是所需设置的应答Header：

 

hresp.setHeader("Access-Control-Allow-Headers", "Content-Type,XFILENAME,XFILECATEGORY,XFILESIZE");

https://blog.csdn.net/z8414/article/details/72780263

SpringBoot允许跨越请求配置 

@Configuration
public class CorsConfig {
 
    //根据配置文件来判断是否开启跨域访问
    @Value("${custom.flag}")
    private boolean flag;
    
    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        if(flag){
            corsConfiguration.addAllowedOrigin("*");
            corsConfiguration.addAllowedHeader("*");
            corsConfiguration.addAllowedMethod("*");
            source.registerCorsConfiguration("/**", corsConfiguration);
        }
        return new CorsFilter(source);
    }
}