axios 解决跨域携带写入cookie问题

使用Vue-cli 和 Tomcat 7 编写的前后端分离项目
由于同源策略
axios 默认跨域请求不携带 cookie 并且 无法将响应头cookie写入浏览器
这导致每次请求都是一次新的会话
下面是解决办法

在 Vue 中 main.js 设置

// 允许请求中携带cookie
axios.defaults.withCredentials=true

下面是设置tomcat 拦截器,

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        HttpServletResponse resp = (HttpServletResponse) servletResponse;
        HttpServletRequest req = (HttpServletRequest) servletRequest;

        // 跨域访问允许源
        resp.setHeader("Access-Control-Allow-Origin", req.getHeader("Origin"));

        resp.setHeader("Access-Control-Allow-Headers","Accept,Authorization,DNT,Content-Type,Referer,User-Agent");

        // 允许跨域访问使用cookie
        resp.setHeader("Access-Control-Allow-Credentials", "true");

        filterChain.doFilter(servletRequest, servletResponse);
    }

设置以上两项就可以解决跨域cookie写入和携带问题

但 Access-Control-Allow-Headers 设置是什么意思,有没有朋友知道的?

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值