HSTS 307重定向跨域问题

本文主要是介绍HSTS 307重定向跨域问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

最近做项目碰到一个奇怪的问题，我的电脑上可以正常访问，同事的电脑上访问出现跨域错误。本地启动一个node服务发送Ajax请求服务端接口，因为是跨域访问，浏览器发送一个OPTIONS请求服务端是否允许当前域名访问，浏览器使用307重定向把http请求转成了https，造成请求数据失败。如下图
在这里插入图片描述
然后各种搜索引擎找了一遍，也没有找到具体怎么解决的方法。以下是我使用的方法
1.了解跨域访问
关于跨域访问可以参考阮一峰老师的博客，里面写的很详细
http://www.ruanyifeng.com/blog/2016/04/cors.html
2.了解HSTS
HSTS(HTTP Strict Transport Security)。它告诉浏览器只能通过HTTPS访问当前资源，而不是HTTP。
3.spring-boot配置允许跨域访问
使用Filter配置

public class CorsFilter implements Filter {@Overridepublic void init(FilterConfig filterConfig) throws ServletException {}/*跨域请求配置*/@Overridepublic void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {HttpServletResponse response = (HttpServletResponse) res;HttpServletRequest reqs = (HttpServletRequest) req;// 服务端允许访问的域名response.setHeader("Access-Control-Allow-Origin","*");// 服务端接受跨域带过来的Cookie,当为true时,origin必须是明确的域名不能使用*response.setHeader("Access-Control-Allow-Credentials", "true");// 服务端允许访问Http Methodresponse.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");// 跨域请求中预检请求(Http Method为Option)的有效期,20天,单位秒response.setHeader("Access-Control-Max-Age", "5000");// 表明它允许跨域请求包含的头response.setHeader("Access-Control-Allow-Headers", "Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, Content-Type, X-E4M-With,Authorization,Token");chain.doFilter(req, res);}

使用WebMvcConfigure配置

@Configuration
public class MvcConfigurer extends WebMvcConfigurerAdapter implements WebMvcConfigurer {@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedHeaders("*").allowedOrigins("*").allowedMethods("GET","POST","PUT","DELETE","HEAD","OPTIONS").allowCredentials(true).exposedHeaders("Access-Control-Allow-Origin","Access-Control-Allow-Credentials", HttpHeaders.SET_COOKIE).maxAge(3600L);}
}

4.将nginx中配置的Strict-Transport-Security 注释
server {
listen 443 ssl;
server_name www.example.com;
#add_header Strict-Transport-Security "max-age=31536000;
}
重新加载nginx 配置文件，再次访问还是跟之前一样的效果，因为HSTS配置的有效期为一年，需要等过期之后才能生效。
查看chrome浏览器的HSTS,在浏览器输入
chrome://net-internals/#hsts，将访问的域名从HSTS中删除
在这里插入图片描述
再次在chrome中访问，之前的307重定向没有了，模型展示效果如下图