ajax请求时cookie,ajax跨域请求中的cookie问题

update 另一个问题

ajax在进行复杂请求如PUT,POST,DELETE等时,当请求为cross domain request是,会先发一个OPTIONS请求确认服务器的跨域支持情况,在发送原来的请求,所以对于服务器,需要对OPTIONS请求做一次xiang'yin

遇到的问题

对于前后端分离的应用,使用ajax跨域请求时,默认情况下是无法传输cookie的。具体的异常表现如下

客户端发送给服务器的请求中不包含cookie信息

服务器返回给客户端的响应中包含了Set Cookie 的信息,但是在浏览器的cookie中,没有记录词条cookie信息

解决方法

需要前后端都做一些小的改动

服务器端

以nodejs的后端为例,使用express框架,需要加上几行代码

app.all('*', function(req, res, next) {

res.header("Access-Control-Allow-Origin", config().allow_origin);

res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");

res.header("Access-Control-Allow-Credentials", "true");

res.header("X-Powered-By", ' 3.2.1')

res.header("Content-Type", "application/json;charset=utf-8");

next();

});

注意这句话:

res.header("Access-Control-Allow-Credentials", "true");

这句话用来允许跨域访问时带上cookie信息,此外有一个问题,就是当我们"Access-Control-Allow-Origin"设置为*的时候,上面这句话是无法使用的。所以不能够设置为*,否则无法使用cookie。

浏览器端

以jquery的ajax请求为例

$.ajax({

url,

type: 'get',

dataType: 'json',

// 允许跨域

crossDomain: true,

// 下面这句话允许跨域的cookie访问

xhrFields: {

withCredentials: true

},

success: (res) => {

console.log(res);

}

});

总结

这个问题就是这样解决的,建议只允许自己前端网站的域名进行跨域访问,防止CSRF之类的攻击。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值