如何使用 Express.js 和 Passport.js 实现用户身份验证-JavaScript中文网-JavaScript教程资源分享门户

在 Web 应用程序开发中，用户身份验证是一个非常重要的方面。为了保护用户的隐私和数据安全，我们需要确保只有授权的用户才能访问敏感信息。在本文中，我们将介绍如何使用 Express.js 和 Passport.js 实现用户身份验证。

Express.js

Express.js 是一个流行的 Node.js Web 框架，它提供了一组强大的 API，用于构建 Web 应用程序。它具有灵活的路由和中间件系统，可以轻松处理各种 HTTP 请求。

在本文中，我们将使用 Express.js 构建我们的 Web 应用程序，并添加必要的路由和中间件。

Passport.js

Passport.js 是一个流行的身份验证中间件，它可以与 Express.js 集成，提供了各种身份验证策略，如本地身份验证、OAuth 和 OpenID 等。

在本文中，我们将使用 Passport.js 实现本地身份验证策略，该策略使用用户名和密码进行身份验证。

实现步骤

步骤 1：安装依赖

首先，我们需要安装必要的依赖。打开终端并导航到项目目录，执行以下命令：

npm install express passport passport-local express-session

步骤 2：配置 Express.js 应用程序

在项目的根目录下创建一个名为 app.js 的文件，并添加以下代码：

// javascriptcn.com 代码示例
const express = require('express');
const session = require('express-session');
const passport = require('passport');
const LocalStrategy = require('passport-local').Strategy;

const app = express();

// 配置中间件
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(session({
  secret: 'secret',
  resave: false,
  saveUninitialized: false
}));
app.use(passport.initialize());
app.use(passport.session());

// 配置路由
app.get('/', (req, res) => {
  res.send('Hello World!');
});

// 启动服务器
app.listen(3000, () => {
  console.log('Server started on port 3000');
});

在代码中，我们首先导入必要的依赖，然后配置中间件和路由。我们还在端口 3000 上启动了 Express.js 服务器。

步骤 3：配置 Passport.js

接下来，我们需要配置 Passport.js。在 app.js 文件中添加以下代码：

// javascriptcn.com 代码示例
// 配置本地身份验证策略
passport.use(new LocalStrategy(
  (username, password, done) => {
    // 在这里实现身份验证逻辑
  }
));

// 序列化和反序列化用户
passport.serializeUser((user, done) => {
  done(null, user.id);
});

passport.deserializeUser((id, done) => {
  // 在这里查询用户并返回
});

在代码中，我们首先导入 passport 和 passport-local，然后配置本地身份验证策略。在 LocalStrategy 的构造函数中，我们需要实现身份验证逻辑。在这个例子中，我们将用户名和密码硬编码在代码中，但在实际应用中，我们应该从数据库或其他外部数据源中获取用户名和密码。

然后，我们需要实现序列化和反序列化用户。序列化用户是将用户对象转换为 ID，以便将其存储在 session 中。反序列化用户是将 ID 转换回用户对象。在这个例子中，我们将用户 ID 存储在 session 中，但在实际应用中，我们应该将用户 ID 存储在 cookie 中，以便在浏览器关闭后仍然可以访问 session。

步骤 4：实现身份验证逻辑

现在，我们需要实现身份验证逻辑。在 LocalStrategy 的构造函数中，我们可以访问传递给函数的用户名和密码。在这个例子中，我们将用户名和密码硬编码在代码中，但在实际应用中，我们应该从数据库或其他外部数据源中获取用户名和密码。

// javascriptcn.com 代码示例
passport.use(new LocalStrategy(
  (username, password, done) => {
    if (username === 'admin' && password === 'password') {
      const user = {
        id: 1,
        username: 'admin',
        password: 'password'
      };
      return done(null, user);
    } else {
      return done(null, false, { message: '用户名或密码错误' });
    }
  }
));

在代码中，我们检查传递给函数的用户名和密码是否与我们硬编码的用户名和密码匹配。如果匹配，我们返回一个包含用户 ID、用户名和密码的用户对象。否则，我们返回一个包含错误消息的错误对象。

步骤 5：实现登录和注销路由

现在，我们需要实现登录和注销路由。在 app.js 文件中添加以下代码：

// javascriptcn.com 代码示例
// 处理登录请求
app.post('/login',
  passport.authenticate('local', {
    successRedirect: '/',
    failureRedirect: '/login',
    failureFlash: true
  })
);

// 处理注销请求
app.get('/logout', (req, res) => {
  req.logout();
  res.redirect('/login');
});

在代码中，我们首先处理登录请求。我们使用 passport.authenticate 中间件来处理身份验证逻辑。如果身份验证成功，我们将用户重定向到主页。否则，我们将用户重定向到登录页，并显示错误消息。

然后，我们处理注销请求。我们使用 req.logout() 方法来删除用户 session 中的用户 ID，并将用户重定向到登录页。

步骤 6：实现受保护的路由

最后，我们需要实现受保护的路由。在 app.js 文件中添加以下代码：

// 受保护的路由
app.get('/profile', (req, res) => {
  if (req.isAuthenticated()) {
    res.send('欢迎访问个人资料页！');
  } else {
    res.redirect('/login');
  }
});

在代码中，我们检查用户是否已经通过身份验证。如果用户已经通过身份验证，我们将用户重定向到个人资料页。否则，我们将用户重定向到登录页。

示例代码

完整的示例代码可以在 GitHub 上找到。

总结

在本文中，我们介绍了如何使用 Express.js 和 Passport.js 实现用户身份验证。我们首先配置了 Express.js 应用程序，并添加了必要的路由和中间件。然后，我们配置了 Passport.js，并实现了本地身份验证策略。最后，我们实现了登录、注销和受保护的路由。这些步骤可以帮助您在自己的应用程序中实现用户身份验证。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/655835acd2f5e1655d26d9de