Javascript 提交带有内容头应用程序的表单/x-www-form-urlencoded会出现404错误,但在Postman中工作正常
我正在构建一个登录页面,前端是React,后端是Express。当我单击submit时,它返回控制台中的错误: 邮政404(未找到) 但是,当我使用postman来测试发布到/auth/login时,它是成功的。在processForm函数中,我尝试使用我编写的post获取不同的api,只是为了查看它是否是前端问题,并且返回时出现422错误(如预期的那样),因此我猜测这是后端问题,但我不确定问题是什么 这是我用来处理表单的react组件中的函数:Javascript 提交带有内容头应用程序的表单/x-www-form-urlencoded会出现404错误,但在Postman中工作正常,javascript,reactjs,express,post,Javascript,Reactjs,Express,Post,我正在构建一个登录页面,前端是React,后端是Express。当我单击submit时,它返回控制台中的错误: 邮政404(未找到) 但是,当我使用postman来测试发布到/auth/login时,它是成功的。在processForm函数中,我尝试使用我编写的post获取不同的api,只是为了查看它是否是前端问题,并且返回时出现422错误(如预期的那样),因此我猜测这是后端问题,但我不确定问题是什么 这是我用来处理表单的react组件中的函数: processForm(e) { e
processForm(e) {
e.preventDefault();
const email = encodeURIComponent(this.state.user.email);
const password = encodeURIComponent(this.state.user.password);
const formData = `email=${email}&password=${password}`;
fetch('/auth/login', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: formData
}).then(response => {
if (response.ok) {
response.json().then(() => {
this.setState({
errors: {}
});
console.log('The form is valid');
})
} else {
response.json().then(error => {
const errors = error ? error : {};
errors.message = error.message;
this.setState({
errors
});
});
}
}).catch(err => {
console.log(err);
});
}
以及我如何使用express router处理后端:
router.post('/login', (req, res) => {
const validationResult = validateLoginForm(req.body);
if (!validationResult.success) {
res.status(400).json({
success: false,
message: validationResult.message,
errors: validationResult.errors,
});
}
res.status(200).end();
});
以及在server.js中装载路由的相关代码:
import AuthRoutes from './routes/auth';
app.use(bodyParser.urlencoded({ extended: false }));
app.use('/auth', AuthRoutes);
您没有使用任何可能导致404的中间件?请尝试其他浏览器(Firefox、Chrome、Safari)。有时,安全扩展或浏览器本身会阻止通过未加密的连接发布用户名和密码类型的数据。如果您查看Chrome inspector,它显示“显示临时标题”,这意味着该帖子在离开您的计算机之前已被客户端阻止。@GardnerBickford我正在使用Chrome。控制台中是否会显示消息“显示临时标题”?它不会出现在开发者工具的“网络”选项卡中。看到这个了吗