护照认证后，Express不会重定向-电脑我帮您

护照认证后，Express不会重定向

我正在使用express在端口5000上运行服务器，我使用create-react-app在端口3000上运行服务器。要管理身份验证，passport.js。

我使用http-proxy-middleware将一些端点代理到快速服务器。这是我的代码：

setupProxy.js

module.exports = function(app) {
    app.use(
        proxy("/signup", {
            target: "http://localhost:5000",
            changeOrigin: true
        })
    );
}

passport.js

passport.use(
"local-signup",
new LocalStrategy(
    {
        passReqToCallback: true
    },
    async (req, username, password, done) => {
        const existingUser = await User.findOne({
            username: username
        });
        if (existingUser) {
            console.log("User already exists");
            done(null, false);
        } else {
            const user = new User();
            user.username = username;
            user.password = password;
            user.save();
            console.log(user);
            done(null, user);
        }
    }
)

);

App.js

app.post(
    "/signup",
    passport.authenticate("local-signup", {
        successRedirect: "/",
        failureRedirect: "/",
        failureFlash: true
    })
);

Component.js

// some code here

onSubmit(event) {
    event.preventDefault();
    axios
        .post(
            "/signup",
            {
                username: this.state.username,
                password: this.state.password
            },
        )

如果我使用邮递员向http://localhost:3000/signup提出请求它只是工作（我打印“用户已经存在”，或者创建一个新的数据库条目，我打印用户信息）。但是如果我在Component.js中使用上面提到的onSubmit函数的表单，我什么也得不到。我没有重定向，没有创建用户。

控制台的网络选项卡指示http://localhost:3000/signup代码302 found（这是有道理的）然后我得到一个代码为http://localhost:3000的304 not modified。

我吓坏了，因为我在堆栈溢出时找不到任何答案。我已经这几天了，完全陷入困境......任何人都可以给我一个关于发生了什么的提示吗？

编辑：感谢各位的帮助，我重构了代码。看来我到了某个地方，但现在我收到400 Bad Request。这是我更新的代码：

App.js

app.post(
    "/signup",
    passport.authenticate("local-signup"),
    (req, res, next) => {
        if (req.user) {
            var redir = { redirect: "/" };
            return res.json(redir);
        } else if (!req.user) {
            var redir = { redirect: "/profile" };
            return res.json(redir);
        }
    }
);

Component.js

onSubmit(event) {
    event.preventDefault();
    axios
        .post("/signup", {
            username: this.state.username,
            password: this.state.password
        })
        .then(function(response) {
            if (response.data.redirect == "/") {
                console.log("Success");
                window.location = "/";
            } else if (response.data.redirect == "/profile") {
                console.log("Failed");
                window.location = "/profile";
            }
        })
        .catch(function(error) {
            console.log("Error");
            window.location = "/profile";
        });
}

我打印出“错误”，如果我打印错误，我只得到400 Bad Request ...

回答如下：

看来我解决了我的问题！非常感谢你们！你是最好的......最后我离开了这个被困的地方。

我跟着this很棒的教程，我只使用了html表单而不是axios post方法。它只是工作:)

这是我的新（工作）代码：

App.js

app.post(
    "/signup",
    passport.authenticate("local-signup", {
        successRedirect: "/", // redirect to the secure profile section
        failureRedirect: "/profile", // redirect back to the signup page if there is an error
        failureFlash: true // allow flash messages
    })
);

Component.js

const Profile = () => {
return (
    <div>
        <h1>Signup</h1>
        <form action="/signup" method="post">
            <div>
                <label>Username</label>
                <input
                    type="text"
                    className="form-control"
                    name="username"
                />
            </div>
            <div>
                <label>Password</label>
                <input
                    type="text"
                    className="form-control"
                    name="password"
                />
            </div>
            <button type="submit" value="Submit">
                Signup
            </button>
        </form>
    </div>
);

};