前后端分离中浏览器请求跨域的headers取不到值的问题

最新推荐文章于 2024-02-29 18:04:37 发布

GastonPeng

最新推荐文章于 2024-02-29 18:04:37 发布

阅读量3k

点赞数

CC 4.0 BY-SA版权

分类专栏：错误总结文章标签：前后端分离中浏览器请求跨域的headers取不到值的问题

本文链接：https://blog.youkuaiyun.com/qq_36421955/article/details/88405409

本文探讨了在前后端分离架构下，浏览器跨域请求时headers中的Authorization字段无法获取的问题。通过实现一个名为AllowOriginFilter的过滤器，设置Access-Control-Allow-Headers来允许携带Authorization和token。然而，当遇到预检请求（OPTIONS）时，headers不会被携带，需要在过滤器中特别处理OPTIONS请求以确保跨域认证的正确进行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近做了个token认证，是前后端分离，大致思路就是用户登陆，成功之后返回token,放在本地sessionstorage中，之后，前端做强求拦截，对于之后的请求，将token信息附加到请求头中。

为了使请求头中Authorization可以被后端获取到，跨域时候做了如下设置：

@Component
@Order(1)
public class AllowOriginFilter implements Filter {

public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {

HttpServletResponse response = (HttpServletResponse) res;
HttpServletRequest request=(HttpServletRequest)req;
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST,GET,PUT,OPTIONS,DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Hea