无法在 Fetch Get 请求中设置任何标头
Posted
技术标签:
【中文标题】无法在 Fetch Get 请求中设置任何标头【英文标题】:Cant Set Any Header in Fetch Get Request 【发布时间】:2021-07-01 10:30:38 【问题描述】:我正在尝试从浏览器向我的后端(节点 + 快递)发送一个获取请求。但不知何故,我的标题似乎没有设置。
这是前端:
let accessToken = localStorage.getItem('accessToken');
fetch('http://localhost:3000/checkLogin',
method: 'GET',
mode: same-origin,
withCredentials: true,
credentials: 'include',
headers:
'Authorization': 'Bearer ' + accessToken,
'Content-Type': 'text/plain',
'X-Test':'test'
)
.then(data =>
console.log('Success:', data);
)
.catch((error) =>
console.error('Error:', error);
);
在后端我尝试启用自定义标头:
server.use(function(req, res, next)
console.log("CORS");
res.set('Access-Control-Allow-Origin', 'localhost:3000/testLogin');
res.set('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
res.set('Access-Control-Allow-Headers', 'Authorization, Content-Type, X-Test');
next(););
我已经尝试过类似问题的答案,但都没有奏效。
当我打印服务器收到的标头时,我得到:
host: 'localhost:3000',
connection: 'keep-alive',
'cache-control': 'max-age=0',
'sec-ch-ua': '"Google Chrome";v="89", "Chromium";v="89", ";Not A Brand";v="99"',
'sec-ch-ua-mobile': '?0',
'upgrade-insecure-requests': '1',
'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (Khtml, like Gecko) Chrome/89.0.4389.114 Safari/537.36',
accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9',
'sec-fetch-site': 'same-origin',
'sec-fetch-mode': 'navigate',
'sec-fetch-user': '?1',
'sec-fetch-dest': 'document',
referer: 'http://localhost:3000/',
'accept-encoding': 'gzip, deflate, br',
'accept-language': 'de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7'
【问题讨论】:
抱歉,我无法撤消我的编辑 您应该从浏览器中得到一些指示,为什么不允许响应。您还应该考虑使用cors
middleware 而不是自己滚动。
cors 中间件也不起作用
【参考方案1】:
您指定的来源无效。它需要有一个方案(例如,http://
或 https://
)。另请注意,起源没有路径。例如,不是'localhost:3000/testLogin'
,而是'http://localhost:3000'
:
res.set('Access-Control-Allow-Origin', 'http://localhost:3000');
【讨论】:
@TimmNicolaizik-Doh!我们都做过这种事情。 :-) 很高兴你知道了!以上是关于无法在 Fetch Get 请求中设置任何标头的主要内容,如果未能解决你的问题,请参考以下文章