在 Express js 中删除会话

Question

更新到数据库后如何删除会话？

我使用 express.js 作为我的后端，并且我已经创建了登录页面。

这是我在 server/routes/api/signin.js 中的会话代码：

/*
  * Logout
  */
 app.get('/api/account/logout', (req, res, next) => {
   //get the token
  const { query } = req;
  const { token } = query;

  UserSession.findOneAndUpdate({
    _id: token,
      isDeleted: false
    }, {
      $set: {
        isDeleted: true
      }
    }, null, (err, sessions) => {
      if(err) {
        return res.send({
          success: false,
          message: 'Error: Server error'
        });
      }
      return res.send({
        success: true,
        message: 'Good'
      });
    });
 });

但在我登录并注销后。我无法再次进入登录页面。 所以我必须从浏览器中清除缓存，然后我才能再次访问我的登录页面。有人知道这个问题吗？

这是我在 client/app/components/Home/Home.js 中用于注销的函数：

logout() {
    this.setState({
      isLoading: true,
    });
    const obj = getFromStorage('the_main_app');
    if (obj && obj.token) {
      const {token} = obj;
      //verify token
      fetch('/api/account/logout?token=' + token)
        .then(res => res.json())
        .then(json => {
          if (json.success) {
            this.setState({
              token: '',
              isLoading: false
            });
          } else {
            this.state({
              isLoading: false,
            });
          }
        });
    } else {
      this.setState({
        isLoading: false,
      });
    }
  }

登录页面：

import React, { Component } from 'react';
import 'whatwg-fetch';
import { Link } from 'react-router-dom';
import { Button } from 'react-bootstrap';

import {
  getFromStorage,
  setInStorage
} from '../../utils/storage';

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

    this.state = {
      isLoading: true,
      token: '',
      signInError: '',
      signInEmail: '',
      signInPassword: '',
    };

    this.onTextboxChangeSignInEmail = this.onTextboxChangeSignInEmail.bind(this);
    this.onTextboxChangeSignInPassword = this.onTextboxChangeSignInPassword.bind(this);
    this.onSignIn = this.onSignIn.bind(this);
  }

  componentDidMount() {
    const obj = getFromStorage('the_main_app');
    if (obj && obj.token) {
      const {token} = obj;
      //verify token
      fetch('/api/account/verify?token=' + token)
        .then(res => res.json())
        .then(json => {
          if (json.success) {
            this.setState({
              token,
              isLoading: false
            });
          } else {
            this.state({
              isLoading: false,
            });
          }
        });
    } else {
      this.setState({
        isLoading: false,
      });
    }
  }

  onTextboxChangeSignInEmail(event) {
    this.setState({
      signInEmail: event.target.value,
    });
  }

  onTextboxChangeSignInPassword(event) {
    this.setState({
      signInPassword: event.target.value,
    });
  }

  onSignIn() {
    //Grab state and post request to backend
    const {
      signInEmail,
      signInPassword
    } = this.state;

    this.setState({
      isLoading: true,
    });

    // POST request to backend
    fetch('/api/account/signin', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        email: signInEmail,
        password: signInPassword,
      }),
    }).then(res => res.json())
      .then(json => {
        if (json.success) {
          setInStorage('the_main_app', { token: json.token });
          this.setState({
            signInError: json.message,
            isLoading: false,
            signInEmail,
            signInPassword,
            token: json.token,
          });
        } else {
          this.setState({
            signInError: json.message,
            isLoading: false,
          });
        }
      });

  }

  render() {
    const {
      isLoading,
      token,
      signInError,
      signInEmail,
      signInPassword,
    } = this.state;

    if (isLoading){
      return (<div><p>Loading...</p></div>);
    }

    if (!token) {
      return (
        <div>
          <div className="the-form">
            {
              (signInError) ? (
                <p>{ signInError }</p>
              ) : (null)
            }
            <center>
              <div className="sign-in container">
                <div className="panel panel-default">
                  <div className="panel-heading">
                    <h3 className="panel-title">
                      Sign In
                    </h3>
                  </div>
                  <div className="panel-body">
                    <div className="form-group">
                      <label htmlFor="email">Email:</label>                  
                      <input type="email" className="form-control" placeholder="Email" value={ signInEmail } onChange={ this.onTextboxChangeSignInEmail } />                
                    </div>
                    <div className="form-group">
                      <label htmlFor="password">Password:</label>                  
                      <input type="password" className="form-control" placeholder="Password" value={ signInPassword } onChange={ this.onTextboxChangeSignInPassword } />                                  
                    </div>
                    <Button bsStyle="primary" onClick={ this.onSignIn }>Sign In</Button>
                    <button className="btn btn-default" ><Link to="/signup">Register</Link></button>
                  </div>                
                </div>
              </div>
            </center>
          </div>
        </div>
      );
    }

    return (
      <div>
        <center>
          <alert>Login success!</alert><br/>
          <button className="btn btn-default" ><Link to="/">&larr; Go Back</Link></button>
        </center>
      </div>
    );
  }
}

export default Login;

Answer 1

在您的注销操作中，您应该添加一个命令以从您的存储中删除令牌。

logout() {
    this.setState({
      isLoading: true,
    });
    const obj = getFromStorage('the_main_app');
    if (obj && obj.token) {
      const {token} = obj;
      //verify token
      fetch('/api/account/logout?token=' + token)
        .then(res => res.json())
        .then(json => {
          if (json.success) {
            // Add your command to delete token from local storage
            // Source : https://developer.mozilla.org/en-US/docs/Web/API/Storage/removeItem
            this.setState({
              token: '',
              isLoading: false
            });
          } else {
            this.state({
              isLoading: false,
            });
          }
        });
    } else {
      this.setState({
        isLoading: false,
      });
    }
  }

我通常使用localStorage.removeItem('Key_Name_You_Want_to_Remove')。 在此处阅读其他信息：https://developer.mozilla.org/en-US/docs/Web/API/Storage/removeItem

如果您使用任何库或实用程序，您可能会发现它可能有所不同。