• 首页 Home
  • 简介 About
  • 项目 Service
  • 案例 Cases
  • 新闻 News
  • 技术文章 本硕新闻 行业资讯

    [vue]使用axios跨域和session失效的问题处理

    发表时间:2019-04-11  热度:

    axios的坑还是很多的,传参成功之后,发现每次请求服务器的session是不一样的,网上查了说是要让每次请求都携带cookie,也就是认证信息。

    请求端JS代码

    import axios from 'axios';
    axios.defaults.withCredentials = true; //意思是携带cookie信息,保持每次请求session的一致性
    //请求的代码,根据自己实际情况填写
    var params=new URLSearchParams()//这里是post传输数据,以form data形式传输而不是requite rayload
    params.append('phoneCode',phoneCode);
    params.append('phone',phone);
    if(this.phoneCode.length>5){
    axios({
    method: 'post',
    url: this.apiurl+"member_phone.php",
    data:params
    }).
    then((response)=> {
    return response.data;
    }).catch((error)=> {
    return "网络错误,请稍后重试";
    })
    }
     

    后端服务器

    设置允许请求域:Access-Control-Allow-Origin:xxx.com

    设置客户端携带证书式访问设置:Access-Control-Allow-Credentials:true

    注意:这里的Access-Control-Allow-Origin:一定要填写准确域名,不能填写*

    以PHP为例子

    header('Access-Control-Allow-Origin:http://localhost:8080');
    header('Access-Control-Allow-Credentials:true');

    这样配置完就可以实现跨域请求并且携带cookies,保持每次请求session的一致性

    文章怎么样?
    相关资讯