获取请求适用于邮递员,但适用于浏览器
Posted
技术标签:
【中文标题】获取请求适用于邮递员,但适用于浏览器【英文标题】:Get request works with postman but with browser 【发布时间】:2021-05-24 12:23:14 【问题描述】:从 POSTMAN 发送的获取请求有效,但从浏览器发送时失败。 即使在使用 bodyparser 中间件之后,后端 req.body 也是未定义的。 从 POSTMAN 发出的请求相同。
这是来自前端的 axios 调用。
await axios.get(`$API_URL/api/authenticate`,
accesstoken: localStorage.getItem("accesstoken")
,
headers:
'Content-Type': 'application/json',
'Accept': 'application/json',
'Access-Control-Allow-Origin': '*',
'Accept-Encoding': 'gzip, deflate, sdch'
)
.then((res) => console.log(res))
.catch((err) =>
localStorage.removeItem("accesstoken");
console.log(err)
);
这是后端身份验证处理程序
const isAuthenticated = (req,res,next)=>
const accesstoken = req.body.accesstoken;
console.log(req.body);
if(!accesstoken)
res.json(msg:"No token provided");
else
jwt.verify(accesstoken,process.env.ACCESS_TOKEN_SECRETE,(err,decoded)=>
if(err)
res.json(msg:"Invalid token");
else
next();
);
这些是 cors 选项
app.use(cors(
origin:["http://localhost:3000","http://192.168.0.86:3000"],
optionsSuccessStatus:200,
credentials:true,
allowHeaders:["Content-Type"]
));
【问题讨论】:
你能捕获这两个请求(例如,使用 tcpdump 或 wireshark)并区分它们吗? 感谢@AllanWind 的回复,实际上我对 tcpdump 或 wireshark 有点不了解,但我可以向您展示后端请求对象的解构。 感谢您回复@AjeetShah,实际上它适用于 POSTMAN,但是当从浏览器发送时它给出 msg:"No token provided",在 POSTMAN 中它返回 msg:"用户已通过身份验证". 【参考方案1】:您用于axios.get
的方法签名适用于axios.post
,其中第二个参数是请求正文。这不适用于axios.get
。您可以将 查询参数 作为 axios.get
的第二个参数传递。 Postman 允许您使用 body 发出 GET 请求,服务器对此没有问题,但不建议这样做。对于您的身份验证用例,请使用 POST。
【讨论】:
非常感谢@LakshyaThakur。 @makarand 你应该接受这个答案。在我的回答中,我假设你打错字了。此外,您可能想阅读以下内容:***.com/q/42068572/2873538。使用POST
发送数据,直到每个人(MDN、邮递员、浏览器、HTTP 客户端库等)开始在GET
中允许data
。
绝对没问题@AjeetShah,我已经进行了更改,并且运行良好,谢谢。【参考方案2】:
我猜,你的意思是axios.post
:
await axios.post(`$API_URL/api/authenticate`,
accesstoken: localStorage.getItem("accesstoken")
,
headers:
'Content-Type': 'application/json',
'Accept': 'application/json',
'Access-Control-Allow-Origin': '*',
'Accept-Encoding': 'gzip, deflate, sdch'
)
.then((res) => console.log(res))
.catch((err) =>
localStorage.removeItem("accesstoken");
console.log(err)
);
【讨论】:
谢谢@AjeetShah,它达到了我的目的,但我很想知道它如何与 POSTMAN 一起工作,请您解释一下吗? 你真的在邮递员中使用了GET
吗?您无法使用GET
发送数据。
嘿@AjeetShah。使用 Postman 可以做到这一点。以上是关于获取请求适用于邮递员,但适用于浏览器的主要内容,如果未能解决你的问题,请参考以下文章
POST 请求适用于 Postman,但不适用于 Guzzle
Axios 发布请求适用于 Postman,但不适用于浏览器(它返回“错误 401-未授权”)
Multipart POST 适用于 Postman,但不适用于 Angular Http Client