Node.js 为什么我在提交添加输入的表单时会收到400错误请求?

Node.js 为什么我在提交添加输入的表单时会收到400错误请求?,node.js,express,routes,http-status-code-400,bad-request,Node.js,Express,Routes,Http Status Code 400,Bad Request,背景:我有一个基于node/express的web应用程序,它基本上是露营地的评级/数据库网站。您可以在此处查看当前工作版本,并在此处查看github:。我刚刚完成了添加用户配置文件的尝试,方法是更新注册表单以包含更多信息,并为每个用户添加一个显示页面。现在,每当我点击注册按钮(或使用邮递员发送post请求/注册),我都会收到一个400错误请求。然后,如果我转到主页,我可以作为我尝试注册的用户登录,这样即使出现错误的请求,该用户也可以注册。我已经尝试过清除缓存和浏览历史记录,并使用其他浏览器,但

背景:我有一个基于node/express的web应用程序,它基本上是露营地的评级/数据库网站。您可以在此处查看当前工作版本,并在此处查看github:。我刚刚完成了添加用户配置文件的尝试,方法是更新注册表单以包含更多信息,并为每个用户添加一个显示页面。现在,每当我点击注册按钮(或使用邮递员发送post请求/注册),我都会收到一个400错误请求。然后,如果我转到主页,我可以作为我尝试注册的用户登录,这样即使出现错误的请求,该用户也可以注册。我已经尝试过清除缓存和浏览历史记录,并使用其他浏览器,但仍然不起作用。我甚至尝试删除我对表单所做的所有更改,使其再次成为用户名和密码,但仍然无法正常工作。我已经试着修复这个问题并调试了几个小时,但我无法理解会发生什么

这是我的注册页面:

<%- include("./partials/header") %>
 
<div class="row">
    <h1 class="login-header">Sign Up</h1>
    <div class="login-form">
        <form action="/register" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input class="form-control" type="text" name="newUser[username]" placeholder="username" id="username">
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="password" placeholder="password" id="password">
            </div>
            <div class="form-group">
                <label for="firstName">First Name</label>
                <input class="form-control" type="text" name="newUser[firstName]" placeholder="First Name" id="firstName">
            </div>
            <div class="form-group">
                <label for="lastName">Last Name</label>
                <input class="form-control" type="text" name="newUser[lastName]" placeholder="Last Name" id="lastName">
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input class="form-control" type="email" name="newUser[email]" placeholder="email@mail.com" id="email">
            </div>
            <div class="form-group">
                <label for="avatar">Avatar</label>
                <input class="form-control" type="text" name="newUser[avatar]" placeholder="avatar url" id="avatar">
            </div>
            <div class="form-group">
                <label for="admin">Admin Key (Enter admin key here if you've been given one)</label>
                <input class="form-control" type="text" name="adminKey" placeholder="********" id="admin">
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block">Sign Up!</button>
            </div>
        </form>
        <a href="/campgrounds">Go Back</a>
    </div>
</div>
 
<%- include("./partials/footer") %>
const express = require("express");
const router = express.Router();
const passport = require("passport");
const User = require("../models/user");
const Campground = require("../models/campground");
 
//root route
router.get("/", (req, res) =>{
    res.render("landing");
});
 
//show register form
router.get("/register", (req, res) =>{
    res.render("register", {page: "register"});
});
 
//handle sign up logic
router.post("/register", (req, res) =>{
    const newUser = new User(req.body.newUser);
    if(req.body.adminKey === "secret"){
        newUser.isAdmin = true;
    }
    User.register(newUser, req.body.password, (err, user) =>{
        if(err){
            return res.render("register", {"error": err.message});
        }
        passport.authenticate("local")(req, res, () =>{
            req.flash("success", "Welcome to YelpCamp " + user.username);
            res.redirect("/campgrounds");
        });
    });
});
 
//login form
router.get("/login", (req, res) =>{
    res.render("login", {page: "login"});
});
 
//login logic
router.post("/login", 
passport.authenticate("local", 
{
    failureRedirect: "/login",
    failureFlash: true
}), (req, res) =>{
    req.flash("success", "Welcome back " + req.user.username);
    res.redirect("/campgrounds");
});
 
//logout
router.get("/logout", (req, res) =>{
    req.logOut();
    req.flash("success", "Logged you out!");
    res.redirect("/campgrounds");
});
 
//user profile
router.get("/user/:id", (req, res) =>{
    User.findById(req.params.id, (err, foundUser) =>{
        if(err){
            req.flash("error", "Something went wrong");
            return res.redirect("back");
        }
        Campground.find().where("author.id").equals(foundUser._id).exec((err, campgrounds) =>{
            if(err){
                req.flash("error", "Something went wrong");
                return res.redirect("back");
            }
            res.render("users/show", {user: foundUser, campgrounds: campgrounds});  
        });
    });
});
 
 
module.exports = router;
<%- include("./partials/header") %>

<div class="row">
    <h1 class="login-header">Sign Up</h1>
    <div class="login-form">
        <form action="/register" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input class="form-control" type="text" name="username" placeholder="username" id="username">
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="password" placeholder="password" id="password">
            </div>
            <div class="form-group">
                <label for="firstName">First Name</label>
                <input class="form-control" type="text" name="firstName" placeholder="First Name" id="firstName">
            </div>
            <div class="form-group">
                <label for="lastName">Last Name</label>
                <input class="form-control" type="text" name="lastName" placeholder="Last Name" id="lastName">
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input class="form-control" type="email" name="email" placeholder="email@mail.com" id="email">
            </div>
            <div class="form-group">
                <label for="avatar">Avatar</label>
                <input class="form-control" type="text" name="avatar" placeholder="avatar url" id="avatar">
            </div>
            <div class="form-group">
                <label for="admin">Admin Key (Enter admin key here if you've been given one)</label>
                <input class="form-control" type="text" name="adminKey" placeholder="********" id="admin">
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block">Sign Up!</button>
            </div>
        </form>
        <a href="/campgrounds">Go Back</a>
    </div>
</div>

<%- include("./partials/footer") %>
//handle sign up logic
router.post("/register", (req, res) =>{
    const newUser = new User({
        username: req.body.username,
        firstName: req.body.firstName,
        lastName: req.body.lastName,
        email: req.body.email,
        avatar: req.body.avatar
    });
    if(req.body.adminKey === "secret"){
        newUser.isAdmin = true;
    }
    User.register(newUser, req.body.password, (err, user) =>{
        if(err){
            return res.render("register", {"error": err.message});
        }
        passport.authenticate("local")(req, res, () =>{
            req.flash("success", "Welcome to YelpCamp " + user.username);
            res.redirect("/campgrounds");
        });
    });
});
以下是我的用户模式:

const mongoose = require("mongoose");
const passportLocalMongoose = require("passport-local-mongoose");

const UserSchema = new mongoose.Schema({
    username: String,
    password: String,
    firstName: String,
    lastName: String,
    email: String,
    avatar: String,
    isAdmin: {type: Boolean, default: false}
});

UserSchema.plugin(passportLocalMongoose);

module.exports = mongoose.model("User", UserSchema);

我已经试着修复了几个小时,如果有任何帮助,我将不胜感激

我终于解决了这个问题。我必须将表单输入上的name属性更改为用户名、密码、电子邮件等。我相信passport local mongoose希望根据这些键值对接收数据,尽管我不确定为什么需要这样做,因为我最终都将数据作为对象提供。如果有人想看到,这里是我的更新和工作代码:

登记表:

<%- include("./partials/header") %>
 
<div class="row">
    <h1 class="login-header">Sign Up</h1>
    <div class="login-form">
        <form action="/register" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input class="form-control" type="text" name="newUser[username]" placeholder="username" id="username">
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="password" placeholder="password" id="password">
            </div>
            <div class="form-group">
                <label for="firstName">First Name</label>
                <input class="form-control" type="text" name="newUser[firstName]" placeholder="First Name" id="firstName">
            </div>
            <div class="form-group">
                <label for="lastName">Last Name</label>
                <input class="form-control" type="text" name="newUser[lastName]" placeholder="Last Name" id="lastName">
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input class="form-control" type="email" name="newUser[email]" placeholder="email@mail.com" id="email">
            </div>
            <div class="form-group">
                <label for="avatar">Avatar</label>
                <input class="form-control" type="text" name="newUser[avatar]" placeholder="avatar url" id="avatar">
            </div>
            <div class="form-group">
                <label for="admin">Admin Key (Enter admin key here if you've been given one)</label>
                <input class="form-control" type="text" name="adminKey" placeholder="********" id="admin">
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block">Sign Up!</button>
            </div>
        </form>
        <a href="/campgrounds">Go Back</a>
    </div>
</div>
 
<%- include("./partials/footer") %>
const express = require("express");
const router = express.Router();
const passport = require("passport");
const User = require("../models/user");
const Campground = require("../models/campground");
 
//root route
router.get("/", (req, res) =>{
    res.render("landing");
});
 
//show register form
router.get("/register", (req, res) =>{
    res.render("register", {page: "register"});
});
 
//handle sign up logic
router.post("/register", (req, res) =>{
    const newUser = new User(req.body.newUser);
    if(req.body.adminKey === "secret"){
        newUser.isAdmin = true;
    }
    User.register(newUser, req.body.password, (err, user) =>{
        if(err){
            return res.render("register", {"error": err.message});
        }
        passport.authenticate("local")(req, res, () =>{
            req.flash("success", "Welcome to YelpCamp " + user.username);
            res.redirect("/campgrounds");
        });
    });
});
 
//login form
router.get("/login", (req, res) =>{
    res.render("login", {page: "login"});
});
 
//login logic
router.post("/login", 
passport.authenticate("local", 
{
    failureRedirect: "/login",
    failureFlash: true
}), (req, res) =>{
    req.flash("success", "Welcome back " + req.user.username);
    res.redirect("/campgrounds");
});
 
//logout
router.get("/logout", (req, res) =>{
    req.logOut();
    req.flash("success", "Logged you out!");
    res.redirect("/campgrounds");
});
 
//user profile
router.get("/user/:id", (req, res) =>{
    User.findById(req.params.id, (err, foundUser) =>{
        if(err){
            req.flash("error", "Something went wrong");
            return res.redirect("back");
        }
        Campground.find().where("author.id").equals(foundUser._id).exec((err, campgrounds) =>{
            if(err){
                req.flash("error", "Something went wrong");
                return res.redirect("back");
            }
            res.render("users/show", {user: foundUser, campgrounds: campgrounds});  
        });
    });
});
 
 
module.exports = router;
<%- include("./partials/header") %>

<div class="row">
    <h1 class="login-header">Sign Up</h1>
    <div class="login-form">
        <form action="/register" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input class="form-control" type="text" name="username" placeholder="username" id="username">
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="password" placeholder="password" id="password">
            </div>
            <div class="form-group">
                <label for="firstName">First Name</label>
                <input class="form-control" type="text" name="firstName" placeholder="First Name" id="firstName">
            </div>
            <div class="form-group">
                <label for="lastName">Last Name</label>
                <input class="form-control" type="text" name="lastName" placeholder="Last Name" id="lastName">
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input class="form-control" type="email" name="email" placeholder="email@mail.com" id="email">
            </div>
            <div class="form-group">
                <label for="avatar">Avatar</label>
                <input class="form-control" type="text" name="avatar" placeholder="avatar url" id="avatar">
            </div>
            <div class="form-group">
                <label for="admin">Admin Key (Enter admin key here if you've been given one)</label>
                <input class="form-control" type="text" name="adminKey" placeholder="********" id="admin">
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block">Sign Up!</button>
            </div>
        </form>
        <a href="/campgrounds">Go Back</a>
    </div>
</div>

<%- include("./partials/footer") %>
//handle sign up logic
router.post("/register", (req, res) =>{
    const newUser = new User({
        username: req.body.username,
        firstName: req.body.firstName,
        lastName: req.body.lastName,
        email: req.body.email,
        avatar: req.body.avatar
    });
    if(req.body.adminKey === "secret"){
        newUser.isAdmin = true;
    }
    User.register(newUser, req.body.password, (err, user) =>{
        if(err){
            return res.render("register", {"error": err.message});
        }
        passport.authenticate("local")(req, res, () =>{
            req.flash("success", "Welcome to YelpCamp " + user.username);
            res.redirect("/campgrounds");
        });
    });
});

我终于解决了这个问题。我必须将表单输入上的name属性更改为用户名、密码、电子邮件等。我相信passport local mongoose希望根据这些键值对接收数据,尽管我不确定为什么需要这样做,因为我最终都将数据作为对象提供。如果有人想看到,这里是我的更新和工作代码:

登记表:

<%- include("./partials/header") %>
 
<div class="row">
    <h1 class="login-header">Sign Up</h1>
    <div class="login-form">
        <form action="/register" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input class="form-control" type="text" name="newUser[username]" placeholder="username" id="username">
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="password" placeholder="password" id="password">
            </div>
            <div class="form-group">
                <label for="firstName">First Name</label>
                <input class="form-control" type="text" name="newUser[firstName]" placeholder="First Name" id="firstName">
            </div>
            <div class="form-group">
                <label for="lastName">Last Name</label>
                <input class="form-control" type="text" name="newUser[lastName]" placeholder="Last Name" id="lastName">
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input class="form-control" type="email" name="newUser[email]" placeholder="email@mail.com" id="email">
            </div>
            <div class="form-group">
                <label for="avatar">Avatar</label>
                <input class="form-control" type="text" name="newUser[avatar]" placeholder="avatar url" id="avatar">
            </div>
            <div class="form-group">
                <label for="admin">Admin Key (Enter admin key here if you've been given one)</label>
                <input class="form-control" type="text" name="adminKey" placeholder="********" id="admin">
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block">Sign Up!</button>
            </div>
        </form>
        <a href="/campgrounds">Go Back</a>
    </div>
</div>
 
<%- include("./partials/footer") %>
const express = require("express");
const router = express.Router();
const passport = require("passport");
const User = require("../models/user");
const Campground = require("../models/campground");
 
//root route
router.get("/", (req, res) =>{
    res.render("landing");
});
 
//show register form
router.get("/register", (req, res) =>{
    res.render("register", {page: "register"});
});
 
//handle sign up logic
router.post("/register", (req, res) =>{
    const newUser = new User(req.body.newUser);
    if(req.body.adminKey === "secret"){
        newUser.isAdmin = true;
    }
    User.register(newUser, req.body.password, (err, user) =>{
        if(err){
            return res.render("register", {"error": err.message});
        }
        passport.authenticate("local")(req, res, () =>{
            req.flash("success", "Welcome to YelpCamp " + user.username);
            res.redirect("/campgrounds");
        });
    });
});
 
//login form
router.get("/login", (req, res) =>{
    res.render("login", {page: "login"});
});
 
//login logic
router.post("/login", 
passport.authenticate("local", 
{
    failureRedirect: "/login",
    failureFlash: true
}), (req, res) =>{
    req.flash("success", "Welcome back " + req.user.username);
    res.redirect("/campgrounds");
});
 
//logout
router.get("/logout", (req, res) =>{
    req.logOut();
    req.flash("success", "Logged you out!");
    res.redirect("/campgrounds");
});
 
//user profile
router.get("/user/:id", (req, res) =>{
    User.findById(req.params.id, (err, foundUser) =>{
        if(err){
            req.flash("error", "Something went wrong");
            return res.redirect("back");
        }
        Campground.find().where("author.id").equals(foundUser._id).exec((err, campgrounds) =>{
            if(err){
                req.flash("error", "Something went wrong");
                return res.redirect("back");
            }
            res.render("users/show", {user: foundUser, campgrounds: campgrounds});  
        });
    });
});
 
 
module.exports = router;
<%- include("./partials/header") %>

<div class="row">
    <h1 class="login-header">Sign Up</h1>
    <div class="login-form">
        <form action="/register" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input class="form-control" type="text" name="username" placeholder="username" id="username">
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="password" placeholder="password" id="password">
            </div>
            <div class="form-group">
                <label for="firstName">First Name</label>
                <input class="form-control" type="text" name="firstName" placeholder="First Name" id="firstName">
            </div>
            <div class="form-group">
                <label for="lastName">Last Name</label>
                <input class="form-control" type="text" name="lastName" placeholder="Last Name" id="lastName">
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input class="form-control" type="email" name="email" placeholder="email@mail.com" id="email">
            </div>
            <div class="form-group">
                <label for="avatar">Avatar</label>
                <input class="form-control" type="text" name="avatar" placeholder="avatar url" id="avatar">
            </div>
            <div class="form-group">
                <label for="admin">Admin Key (Enter admin key here if you've been given one)</label>
                <input class="form-control" type="text" name="adminKey" placeholder="********" id="admin">
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block">Sign Up!</button>
            </div>
        </form>
        <a href="/campgrounds">Go Back</a>
    </div>
</div>

<%- include("./partials/footer") %>
//handle sign up logic
router.post("/register", (req, res) =>{
    const newUser = new User({
        username: req.body.username,
        firstName: req.body.firstName,
        lastName: req.body.lastName,
        email: req.body.email,
        avatar: req.body.avatar
    });
    if(req.body.adminKey === "secret"){
        newUser.isAdmin = true;
    }
    User.register(newUser, req.body.password, (err, user) =>{
        if(err){
            return res.render("register", {"error": err.message});
        }
        passport.authenticate("local")(req, res, () =>{
            req.flash("success", "Welcome to YelpCamp " + user.username);
            res.redirect("/campgrounds");
        });
    });
});

你能显示你的注册路径吗?@RaviShankarBharti这是“handle signup logic”下的代码块,该代码块以router.post(“/register”)开头你能在模式中显示你的User.register方法吗?@RaviShankarBharti我已经编辑了这个问题以包含用户模式。这个方法来自passport local mongoose。你能显示你的注册路径吗?@RaviShankarBharti它是“handle signup logic”下的代码块,以router.post(“/register”)开头你能在模式中显示你的User.register方法吗?@RaviShankarBharti我已经编辑了这个问题以包含用户模式。该方法来自passport local mongoose。