当用户使用 passportjs 成功登录时，如何在 reactjs 中重定向页面

Question

嘿，我是 reactjs 和 nodejs 的初学者，正在尝试制作我的第一个全栈应用程序。我正在使用 passportjs 进行身份验证，我成功地注册用户并在 mongodb 中保存数据并验证用户身份，但我面临的问题是在用户成功登录时重定向到另一个页面以做出反应。我是使用 axios 将数据发送到节点服务器。如果你们需要任何其他文件，请告诉我

登录表单

import React from 'react'
import {Component} from 'react';
import './login.css'
import {Button} from 'react-bootstrap'
import axios from 'axios'


class Login extends Component{
    constructor(props){
        super(props);
        this.state={
            username:'',
            password:''
        }
        this.handleUsernameChange=this.handleUsernameChange.bind(this)
        this.handlePasswordChange=this.handlePasswordChange.bind(this)
        
    }

    handleUsernameChange=(e)=>{
        this.setState({
            username:e.target.value,
        })
    }
    handlePasswordChange=(e)=>{
        this.setState({
            password:e.target.value,
        })
    }
    handleSubmit=(e)=>{
        e.preventDefault()
        const logindata = {
            username:this.state.username,
            password:this.state.password
        }

        axios.post('http://localhost:4002/api/login',logindata)
            .then(response=>console.log(response.data))
    }
    render(){
        return(
                <form>
                </form>
            </div>
        );
    }
}
export default Login;

节点（护照）

const { request, response } = require('express')
const express=require('express')
const router = express.Router()
const registertemplatecopy=require('../models/user')
const bcryt=require('bcrypt')
const jwt =require('jsonwebtoken')
const postjobtemplatecopy=require('../models/postjobmodels')
const passport=require("passport")
const cookieparser=require('cookie-parser')
const passportLocal=require("passport-local").Strategy;
const bodyParser=require("body-parser")


require('../passport-config')(passport);

router.post("/login", (req, res, next) => {
    passport.authenticate("local", (err, user, info) => {
      if (err) throw err;
      if (!user) res.send("No User Exists");
      else {
        req.logIn(user, (err) => {
          if (err) throw err;
          res.send("Successfully Authenticated");
          console.log(req.user);
        });
      }
    })(req, res, next);
  });

Answer 1

登录成功后即可使用history.push("/someroute")

axios.post('http://localhost:4002/api/login',logindata)
    .then(response=>{
        if(response.status === 200) return history.push("/someroute");
        else if ...
})
    .catch(err => /* do something with error*/)

并在 router.post("/login")

res.status(200).send("Successfully Authenticated").

您应该始终将状态与内容一起发送。

当用户使用 passportjs 成功登录时，如何在 reactjs 中重定向页面

How to Redirect pages in reactjs when user succesfully logs in using passportjs

javascript

node.js

reactjs

axios

passport.js