起因
按照接口文档要求,此次请求需要携带cookie,老是请求失败。有时候在浏览器上先把请求地址跑一遍,到小程序上请求又能请求成功了,但一会又失效了,变成了灵异事件,还以为是后台的问题,但是浏览器和postman都能直接跑通,说明服务器没问题。
现在把遇到的几个坑重头记录下,还是自己对带cookie的请求理解不深和项目文档没写清楚应该问后端。
手动添加完请求头后,测试请求失败,在Chrome开发者工具里network选项卡里检查下这次的请求的格式是否正确。
export default (url, data = {}, method = \'GET\') => {
return new Promise((resolve, reject) => {
// 1.初始化promise状态为pending
// 2.执行异步任务
wx.request({
url: config.host + url,
data,
method,
header: {
// 请求头添加cookie字段
\'cookie\': wx.getStorageSync(\'cookies\')
},
// 3.根据异步任务的结果修改promise的状态
success: (res) => {
// 登录成功请求,将用户cookine字段保存至本地
if (data.isLogin) {
wx.setStorageSync(\'cookies\', res.cookies)
}
console.log(res, \'request42行\');
// 修改promise状态为成功resolve
resolve(res.data)
},
fail: (err) => {
console.log(\'请求失败\', err);
// 修改promise状态 为成功reject
reject(err)
}
})
})
}
检查cookie字段并进行测试
检查storage是否储存到了cookies,发现是个数组
请求失败了,一看请求头携带的cookie字段,cookie: [object Array],cookie明显被处理过了。
判断格式cookie(显然请求头中cookie不可能是数组)不对,然后数据被调用了Object.prototype.toString.apply(cookies)
将cookie处理为字符串后,果然不触发Object.prototype.toString.apply()了,但是请求仍然失败
然后用浏览器跑了遍接口,对应的在微信小程序对应的接口又能跑通了。打开了浏览器的cookie查看,明显格式和上面在小程序显示cookie字段不一样
思考:这里浏览器直接就能跑通是因为cookie携带成功,但是小程序的cookie需要手动添加cookie字段。所以很明显问题是添加的时候出现了问题。
同时灵异事件也解释通了,是因为在用浏览器在对应的接口跑通了验证了cookie所以,你回到微信小程序可以直接访问。
思考
解决思路:肯定是要按照浏览器的cookie字段更改。
思考:登录时,我们从响应体拿到了这么多cookie字段,而浏览器cookie就存储四个字段。所以解决办法显而易见,逐一测试哪个一个字段才是我们此次请求需要添加的字段。
经过测试浏览器上四个字段中的一个,键名为MUSIC_U 的字段才是我们此次请求需要的字段
解决方法
首先需要对请求头中拿到的cookies数组中的某一项,找到带\'MUSIC_U\'字段
然后判断本地cookies已经返回,如果没有,直接取空串。终于成功了。
总结
1.cookie是文本,所以只能是字符串。若拿到后端返回的cookie格式不对时一定要处理
2.面对多个cookie字段时,应该搞清楚每个字段的作用。多和后端沟通。而不是自己一个一个猜浪费时间。
请发表评论