繁体   English   中英

在Express JS中删除会话

[英]Delete Session in Express js

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

我使用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;

在注销操作中,应该添加命令以从存储中删除令牌。

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

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM