axios 解决cookie跨域问题

1.问题背景:
前端使用vue,axios 调用服务端api,
前端域名:aaa.bb.u.cn
后端域名:server.ss.u.cn
发现后端写完session,cookie后,浏览器获取不到session,查看浏览器也没有cookie,此时已经确保后端的session和cookie是种成功的
并且,再服务端的配置中,已经设置了跨域支持,如下:

location ~ /*.php$ {
add_header ‘Access-Control-Allow-Origin’ KaTeX parse error: Double superscript at position 62: …Allow-Methods' '̲GET,POST,OPTION…request_method = ‘OPTIONS’) {
add_header ‘Access-Control-Max-Age’ 86400;
add_header ‘Content-Type’ ‘text/plain; charset=utf-8’;
add_header ‘Content-Length’ 0;
return 204;
}

  fastcgi_index index.php;
  fastcgi_read_timeout 300;
  include fastcgi.conf;
  fastcgi_pass 127.0.0.1:9101;

}

2.解决如下:
因为前端使用了基于promise的http库,axios,
有跨域问题时请求如下:
this.axios({
url:Global.originUrl+’/proj’,
method:‘GET’
}).then((response) => {
//do something
});

需要添加withCredentials:true, 即支持跨域,默认是false

如下:
this.axios({
url:Global.originUrl+’/proj’,
withCredentials:true,
method:‘GET’
}).then((response) => {
//do something
});

yes,yes,yes 成功

3.总结一下跨域
(1)前端
(1.1)ajax jsonp
(1.2) axios withCredentials:true
(2)服务端
add_header ‘Access-Control-Allow-Origin’ KaTeX parse error: Double superscript at position 62: …Allow-Methods' '̲GET,POST,OPTION…request_method = ‘OPTIONS’) {
add_header ‘Access-Control-Max-Age’ 86400;
add_header ‘Content-Type’ ‘text/plain; charset=utf-8’;
add_header ‘Content-Length’ 0;
return 204;
}

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章