（Node.js和React.js）成功登录后如何删除/显示不同的按钮？

Question

因此，我试图通过将React.js和Node.js连接到Firebase创建一个简单的登录页面，我想我已经成功进行了身份验证和连接，但是成功登录后却遇到了问题。我想添加或删除新按钮成功登录后。我不知道该怎么做，我尝试了很多搜索，但无济于事。

这是我用于登录的server.js代码：

app.post('/api/login',  function(req, res) 
{
   var success = false;
   var email = req.body.email;
   var password = req.body.password;
   console.log(email);
   console.log(password);
   Firebase.auth().signInWithEmailAndPassword(email, String (md5(password)).valueOf())
.then(function(userData)
{
    console.log("Authenticating...");
    usersRef.orderByChild('email').equalTo(email).once("child_added", function(snapshot)
    {
        var newPost = snapshot.val();

        jwt.sign(newPost.id, "secretKey", (error,token) =>
        {
        console.log("Successfully logged in");
        res.send({token: token, success: true });
        });
    }); 
})
.catch(function(error)
{
    console.log("Error logging in: Invalid username/password");
    res.status(401).send({"Error":"Error logging in: Invalid username/password ", auth: false, token: null });
});
});

当我在客户端（App.js）上启动它时，这工作得很好：

import React, { Component } from 'react';
import './App.css';
import { Link } from 'react-router-dom'

class App extends Component {
constructor(props) {
super(props);

 }
  render() {
  return (
<div className="App-header">
    <h2>Homepage</h2>

  <form id="login_div" action="/api/login" method="post" class="main-div">
   <div>
       <label for="email">Email: </label>
       <input type="text" id="email" name="email"></input>
       <label for="password">Password: </label>
       <input type="password" id="password" name="password"></input>
   </div>
   <input type="submit" value="Submit"></input>
  </form>
</div>
  );
}
}
export default App;

这些代码可以正常运行，但是随后显示带有正确令牌和成功状态的白页。 有没有一种方法可以在登录前后控制我的登录页面？

Answer 1

这些代码可以正常运行，但是随后显示带有正确令牌和成功状态的白页。 有没有一种方法可以在登录前后控制我的登录页面？

当然可以，但是您在此行使用令牌和自己的成功响应登录：

res.send({token: token, success: true });

该行以json响应对'/ api / login'的成功请求，这是API请求的常见响应格式，但是您在App.js上实现表单的方式需要使用html文档或至少响应重定向。 您的概念是令人误解的，因为当您要向“ api / login”发出请求的方法是ajax /异步调用时，App.js中的表单会期望同步响应。