跨域ajax请求如何保持session状态

1.提出问题:

Ajax在跨域请求的时候,session会话会丢失,每请求一次都会生成一个新的session_id,即当成一个新的会话,无法跟踪用户的状态,这个问题该如何解决呢?

2.解决办法:

第一步:前端ajax部分:

$.ajax({
  url: 'http://my.test.com/server.php', //跨域 
  xhrFields:{withCredentials: true}, // 发送凭据,表示保持会话 
  dataType: 'json', 
  type: 'post', 
  data: {'name':'fdipzone'},          
  success:function(ret){ 
    if(ret['success']==true){ 
     alert('cookie:' + ret['cookie']); 
   } 
  } 
});

第二步:后端服务部分(server.php):

//允许跨域访问的来源域名,如:http://localhost:8080,只能设置一个,
//以下设置的是任意来源
header('Access-Control-Allow-Origin:'.$_SERVER['HTTP_ORIGIN']);
//允许跟踪会话,保持session或cookie
header('Access-Control-Allow-Credentials:true');
//允许请求的方式:GET和POST
header('Access-Control-Allow-Methods:GET,POST');
//允许的headers
header('Access-Control-Allow-Headers:x-requested-with,content-type');

第三步:到处前后端就实现了跨域访问,并且能够跟踪会话,大功告成!

注意事项:

1.当Access-Control-Allow-Credentials设为true时,不能如下这么设置,必须绑定一个具体的域名:
header('Access-Control-Allow-Origin:*');//不对
2.在vue.js框架下实现跨域时:在main.js中开启跨域配置即可:
Vue.http.options.emulateJSON = true
Vue.http.interceptors.push(function (request, next) {     
   request.credentials = true     
   next()
})

 

 

发表评论

电子邮件地址不会被公开。 必填项已用*标注