【React】react使用fetch api获取到了jwt返回的token然后带上该token继续请求报错

• Z时代
• 2024-01-10
• 分类：技术分享

外层fetch获取到了token，里面的fetch报错，并且请求头里面没有传输的Authorization。

let token;

fetch('http://192.168.188.128:9080/user/login', {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
username: 'zhangjh',
password: 123,
}),
})
.then(res => res.json())
.then((json) => {
token = json.token;
fetch('http://192.168.188.128:9080/user/userid', {
method: 'post',
mode: 'no-cors',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
Authorization: token,
},
})
.then(res => res.json())
.then((data) => {
console.log(data);
})
.catch(err => console.log(err));
})
.catch(err => console.log(err));

回答

谢谢大家已解决，我的写法是没问题的，原因是后台把第二个请求的cors禁用了，然后是响应头Access-Control-Allow-Header没有包含Authorization，导致跨域请求不成功和请求头不通过两种错误。

headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    Authorization: token,
}

你这么写没问题？属性不应该有单引号或者双引号么？你这个根本没有进行请求就报错了吧 ！！！Authorization要加引号的吧。

headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    'Authorization': token,
 }

Hi, 我建议你可以试试以下方法：

1. 首先用postman测试下服务器是否正常工作，支持headers里面的内容。如果没有问题，我再定位到你fetch那段code。
2. 如果你使用OAuth是不是应该在token前面加上"Bearer " 或者其他的 ？
3. 还有你使用的post方法，类型是'application/x-www-form-urlencoded'，但是没有传递body ?

jwt token前面要加Bearer

以上是 【React】react使用fetch api获取到了jwt返回的token然后带上该token继续请求报错 的全部内容， 来源链接： utcz.com/a/74895.html