node.js平台下利用cookie实现记住密码登陆（Express+Ejs+Mysql）

下面是详细的攻略：

准备工作

在进行下一步操作前，请确保你已经安装好了以下软件：

Node.js
MySQL数据库

同时，在项目目录下创建一个 .env 文件，用于存储私密信息。文件格式如下：

PORT=3000
SECRET=your_secret_key
DB_HOST=localhost
DB_PORT=3306
DB_USER=root
DB_PASSWORD=your_password
DB_NAME=your_database_name

这里需要注意，其中的 SECRET 字段用于指定加密 cookie 的密钥，应当使用一个难以猜测的字符串进行设置。

配置数据库

在 MySQL 中创建一个数据库，然后在数据库中创建一张名为 users 的表，用来存储登录用户的信息。表的结构如下：

CREATE TABLE users (
  id INT PRIMARY KEY AUTO_INCREMENT,
  username VARCHAR(255) NOT NULL UNIQUE,
  password CHAR(60) NOT NULL
);

在该表中插入一条测试数据：

INSERT INTO users (username, password) VALUES ('test', '$2a$10$mqFy1PDYDt3bREqk7vSdOOZHZ5c.6VVBchAxQoWzABNGyZzWkY2/q');

其中，密码字段使用了 bcrypt 加密算法，用于保障用户密码的安全性。

编写代码

安装依赖

在项目根目录下执行以下命令，安装依赖：

npm install express express-session ejs mysql2 bcrypt cookie-parser dotenv

创建 Express 应用

在项目根目录下创建一个名为 app.js 的文件，并编写如下代码：

const express = require('express');
const session = require('express-session');
const ejs = require('ejs');
const mysql = require('mysql2/promise');
const bcrypt = require('bcrypt');
const cookieParser = require('cookie-parser');
const dotenv = require('dotenv');

const app = express();
dotenv.config();

app.set('view engine', 'ejs');

app.use(express.urlencoded({ extended: true }));
app.use(cookieParser());
app.use(session({
  secret: process.env.SECRET,
  resave: false,
  saveUninitialized: false
}));

const pool = mysql.createPool({
  host: process.env.DB_HOST,
  port: process.env.DB_PORT,
  user: process.env.DB_USER,
  password: process.env.DB_PASSWORD,
  database: process.env.DB_NAME
});

app.get('/', (req, res) => {
  res.render('index', { user: req.session.user });
});

app.get('/login', (req, res) => {
  res.render('login');
});

app.post('/login', async (req, res) => {
  const { username, password, remember } = req.body;
  const conn = await pool.getConnection();
  const [ rows ] = await conn.query('SELECT * FROM users WHERE username = ?', [ username ]);
  conn.release();

  if (rows.length === 0) {
    return res.render('login', { error: '用户名或密码不正确' });
  }

  const user = rows[0];

  if (!bcrypt.compareSync(password, user.password)) {
    return res.render('login', { error: '用户名或密码不正确' });
  }

  req.session.user = user;

  if (remember) {
    res.cookie('remember', user.username, { maxAge: 7 * 24 * 3600 * 1000 });
  } else {
    res.clearCookie('remember');
  }

  return res.redirect('/');
});

app.get('/logout', (req, res) => {
  req.session.destroy();
  res.redirect('/');
});

app.listen(process.env.PORT, () => {
  console.log(`Server is running on port ${process.env.PORT}`);
});

创建模板文件

在项目根目录下创建一个名为 views 的文件夹，在其中创建 index.ejs 和 login.ejs 两个文件，分别用于展示首页和登录页面。模板文件的内容如下：

index.ejs：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Node.js+MySQL记住密码登陆示例</title>
</head>
<body>
  <% if (user) { %>
    <p>当前已登录为 <%= user.username %> <a href="/logout">退出</a></p>
  <% } else { %>
    <p>当前未登录 <a href="/login">点击此处登录</a></p>
  <% } %>
</body>
</html>

login.ejs：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>登录</title>
</head>
<body>
  <% if (error) { %>
    <p style="color: red;"><%= error %></p>
  <% } %>
  <form method="post">
    <div>
      <label for="username">用户名：</label>
      <input type="text" name="username" id="username">
    </div>
    <div>
      <label for="password">密码：</label>
      <input type="password" name="password" id="password">
    </div>
    <div>
      <label for="remember">记住密码：</label>
      <input type="checkbox" name="remember" id="remember" value="1">
    </div>
    <button type="submit">登录</button>
  </form>
</body>
</html>

分析代码

以上代码使用了 express 框架，同时使用了 express-session、mysql2、bcrypt、cookie-parser 和 dotenv 四个中间件库。

其中，express-session 库用于处理会话信息，mysql2 库用于连接和操作 MySQL 数据库，bcrypt 库用于密码加密，cookie-parser 库用于解析 cookie，dotenv 库用于读取 .env 文件中的配置信息。

在代码中，我们通过 app.use 方法将这些中间件注册到了 Express 应用中，使其生效。

在 /login 路由处理函数中，我们取得了表单中提交的用户名和密码，并使用 bcrypt 库中的 compareSync 方法将其和数据库中的用户密码进行比较。如果密码匹配成功，则将用户信息存储到会话中，并根据用户是否勾选了“记住密码”选项来设置 cookie。

在 /logout 路由处理函数中，我们使用 req.session.destroy 方法销毁了会话信息。

在模板文件中，我们使用了 EJS 模板引擎，根据用户的登录状态动态展示不同的内容。

示例说明

示例 1：记住密码

当用户在登录页面勾选了“记住密码”选项并成功登录后，服务器会向客户端发送一个名为 remember 的 cookie，有效期为 7 天。这样，当用户在下次访问网站时，客户端会自动携带该 cookie，服务器就可以根据其内容自动登录用户。

示例 2：退出登录

当用户在访问站点时，若发现客户端携带了正确的 session 数据，会展示出“当前已登录为 XXX 退出”按钮，当用户点击了退出时，服务器会调用 req.session.destroy 方法，销毁当前 session 中的数据，客户端的状态也会及时清除。因此，当用户再次访问时，应当重新登录，无法直接进入已登录状态。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：node.js平台下利用cookie实现记住密码登陆（Express+Ejs+Mysql） - Python技术站