Express.js 中使用 Passport 实现用户认证

在现代 web 应用程序中，用户认证是必不可少的功能。有许多开源的认证库可以使用，其中 Passport 是最流行的之一。它是一个可扩展的 Node.js 应用程序，可用于通过多种认证方式进行用户认证。在本文中，我们将探讨如何在 Express.js 中使用 Passport 实现用户身份认证。

安装 Passport 和相关模块

在开始之前，我们需要确保安装了 Node.js 和 Express.js。然后，我们可以使用 npm 安装 Passport 和相关模块：

--- ------- -------- -------------- ---------------

解释一下上述命令：

配置 Passport 中间件

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

----- ------- - -------------------
----- ------- - ---------------------------
----- -------- - --------------------
----- ------------- - -----------------------------------

----- --- - ----------

-----------------
    ------- ------------------
    ------- ------
    ------------------ ----
----

-------------------------------
----------------------------

----------------------------- ----- -- -
    ---------- ---------
---

----------------------------- ----- -- -
    ----------------- ----- ----- -- -
        --------- ------
    ---
---

---------------- ---------------
    -------------- --------
    -------------- ----------
-- ------- --------- ----- -- -
    -------------------- ------- ----- ----- -- -
        -- ----- -
            ------ ----------
        -
        -- ------- -
            ------ ---------- -------
        -
        -- ------------------------------- -
            ------ ---------- -------
        -
        ------ ---------- ------
    ---
----

让我们逐步解释代码。首先，我们需要导入所需的 JavaScript 库。在这个例子里，我们导入了 Express.js、express-session、passport 和 passport-local。

然后，我们为 Express.js 应用程序配置了 session 和 Passport 中间件。session() 函数返回中间件，用于管理客户端和服务器之间的会话状态。因为我们的会话状态需要在客户端和服务器之间共享，所以我们需要将 secret 设置为一个加密密钥。passport.initialize() 和 passport.session() 是 Passport 中间件，用于设置和存储用户的认证状态。

接下来，我们需要设置序列化和反序列化功能来支持用户认证。序列化函数将用户对象转换为唯一的标识符，反序列化函数将标识符转换回用户对象。这个过程让 Passport 能够存储和提取用户对象。

最后，我们需要配置本地策略（即使用用户名和密码进行身份验证）。在这个例子中，我们使用了本地策略，并通过 findOne() 函数查询用户数据库以查找匹配的用户。如果找到了用户，我们将调用 validPassword() 函数来验证密码，如果验证成功，则 Passport 将设置用户的认证状态。如果未找到用户或密码不正确，则 Passport 会将响应的状态设置为 false。

配置路由

接下来，我们需要设置路由，用于处理用户登录、注册等网页上的操作。在 app.js 文件中添加以下代码：

------------ ----- ---- -- -
    ------------------- ------ -----------
---

----------------- ----- ---- -- -
    --------------------
---

------------------ ------------------------------ -
    ---------------- ----
    ---------------- ---------
    ------------- ----
----

------------------ ----- ---- -- -
    ---------------------
---

------------------- ----- ---- ----- -- -
    ----- ------- - --- ------
        ------ ---------------
        --------- -----------------
    ---

    ------------------ -- -
        -- ----- -
            ------ ----------
        -
        ------------------
    ---
---

------------------ ----- ---- -- -
    -------------
    ------------------
---

在这段代码中，我们定义了根目录、登录、注册和注销路由。在根目录路由中，我们使用 render() 方法渲染 index.ejs 模板，并将认证的用户对象传递给模板。在登录和注册路由中，我们使用 render() 方法来渲染登录和注册页面。在 authenticate() 方法中，我们使用本地策略进行身份验证。如果身份验证成功，则将用户重定向到根目录，并且在失败的情况下重定向到登录页面。在注册路由中，我们创建了一个新用户对象，并将其保存到数据库中。在注销路由中，我们调用 logout() 方法来清除用户的认证状态。

模板和视图

最后，让我们创建模板和视图文件。在 views 目录中，我们将创建以下文件：

views/index.ejs:

--------- -----
------
------
    ------------------ ------------
-------
------
    -- -- ------ - --
        ---------- --- ---------- -- - -- -----------------------------
    -- - ---- - --
        ---------- - -- ----------------------- -- -- -----------------------------
    -- - --
-------
-------

views/login.ejs:

--------- -----
------
------
    ------------------ ------------
-------
------
    --------------
    -- -- --------- - --
        ------ ------- ------
    -- - --
    ----- ------------- ----------------
        ---------------------
        ------ ------------ -----------------
        ------------------------
        ------ --------------- --------------------
        ------ ------------- --------------
    -------
-------
-------

views/signup.ejs:

--------- -----
------
------
    ------------------ ------------
-------
------
    ---------------
    -- -- --------- - --
        ------ ------- ------
    -- - --
    ----- ------------- -----------------
        ---------------------
        ------ ------------ -----------------
        ------------------------
        ------ --------------- --------------------
        ------ ------------- ---------------
    -------
-------
-------

在这些模板中，我们使用 EJS 模板语言来定义视图。在 index.ejs 模板中，我们根据用户是否已登录来显示欢迎信息。在登录和注册模板中，我们使用表单和 POST 方法来处理用户输入。

运行应用程序

现在，运行应用程序并在浏览器中输入 http://localhost:3000 来访问页面。在访问登录或注册页面时，您应该被重定向到特定的 URL。当您输入错误的用户名或密码时，系统应该返回错误消息。当您成功登录后，您应该被重定向到主页，并且您应该看到欢迎消息。当您注册新用户后，您应该能够登录并访问主页。

总结

在本文中，我们学习了在 Express.js 中使用 Passport 实现用户认证。我们了解了如何配置 Passport 中间件和本地策略，并定义了相关的路由和视图。现在，您应该能够使用 Passport 来管理用户的身份验证，并在自己的 web 应用程序中实现安全的用户体验。别忘了，始终需要小心保护和管理用户的敏感信息和凭证。

来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6495e88648841e98942ea34a

阅读全文

猜你喜欢

  • Serverless 实现阿里云的无服务器架构

    随着云计算领域的发展，无服务器（Serverless）架构成为越来越受欢迎的一个方向。相较于传统的基于服务器的架构，无服务器架构能够极大地简化开发者的工作流程，并降低运维成本。

    1 年前
  • TypeScript 中变量、常量与枚举的使用方式

    TypeScript 是一种扩展了 JavaScript 的编程语言，它为 JavaScript 增加了对类型检查、类、接口、泛型等特性的支持。在 TypeScript 中，使用变量、常量和枚举是非常...

    1 年前
  • Express.js 中的代码分层设计方法

    在开发 Web 应用程序时，代码的设计和组织对于应用程序的可维护性和扩展性来说至关重要。而代码分层设计方法就是一种将代码组织成不同层次结构的方法，使得各层代码彼此独立、便于维护和修改。

    1 年前
  • ES6 默认参数的使用及常见问题解决

    在 ES6 语法中，函数可以为其参数指定默认值。默认参数是指在没有传入或传入 undefined 时，参数取默认值。本文将讨论 ES6 默认参数的用法和一些常见问题的解决方法。

    1 年前
  • Enzyme 中如何进行 React 组件的嵌套测试

    Enzyme 中如何进行 React 组件的嵌套测试 React 是一个非常受欢迎的 JavaScript 库，用于构建交互式用户界面。在 React 中，组件是构建 UI 的基本单元。

    1 年前
  • 常用 CSS Reset 库与自定义样式的优缺点分析

    在前端开发中，我们常常需要对网页中的各个元素进行样式的设置，以达到视觉上的美观和统一性。然而，在不同的浏览器中，各个元素的默认样式却不尽相同，这给我们的工作带来了不小的困难。

    1 年前
  • 使用 ES12 的 Dynamic Import 来提高 Webpack 打包效率

    随着 Web 应用程序中的复杂性日益增加，Webpack 打包工具变得越来越重要，因为它可以帮助我们管理应用程序的各个部分，并将它们打包成一个文件以提高性能。然而，随着应用程序的增长，Webpack ...

    1 年前
  • 如何使用 Cypress 测试 Ember.js 应用

    Cypress 是一个先进的前端端到端测试框架，通过其 API，我们能够方便地测试我们的应用。而 Ember.js 是一个流行的前端框架，为开发者提供了一个全面的解决方案，能够让我们快速、高效地创建出...

    1 年前
  • PM2 如何实现 Node.js 应用的进程宕机自动重启

    在 Node.js 应用的开发和部署中，我们常常需要保证应用的稳定运行。但是，在实际应用中，进程宕机是无法避免的情况之一。为了保证应用的可用性，我们需要一种能够自动监控并重启宕机进程的工具，而 PM2...

    1 年前
  • Headless CMS：内容一体化管理

    随着互联网的快速发展，我们需要越来越多的内容来推广我们的产品和服务，以及吸引我们的潜在客户。这意味着我们需要管理大量的内容，包括文字、图像、视频等等。同时，我们还需要让这些内容能够在各种不同的设备和场...

    1 年前
  • PWA 实现图片压缩上传的技巧

    在移动应用中，上传图片是一项常见的功能。但是，由于图片文件过大，不仅会占用用户的流量，也会对服务器造成很大的负担。因此，在上传图片之前需要对图片进行压缩处理。 Progressive Web App（...

    1 年前
  • JavaScript 将引入 Asynchronous Iteration 构建工具

    在 JavaScript 的新版本 ECMAScript 2020 中，将会增加一项新的特性 - Asynchronous Iteration。它为开发者提供了更便捷的异步编程方式，可以很好地应用在构...

    1 年前
  • 使用 LESS 实现 CSS 模块化开发的好处和方法

    前言 在以往的前端开发中，我们经常会面临着 CSS 模块化的问题。随着项目复杂度的提高，CSS 文件的数量和复杂度不断增加，如何有效地管理 CSS 文件成为了一道难题。

    1 年前
  • 使用 Babel 编译 React 项目：经常遇到的问题及解决方法

    随着 React 技术的发展，越来越多的开发者开始学习和使用 React 来开发 Web 应用程序。然而，React 库需要通过编译才能在浏览器中运行。为了快速、高效地编写 React 应用程序，使用...

    1 年前
  • 如何在 Mocha 中使用 Mockgoose 测试 MongoDB

    Mockgoose 是一个实现了在 MongoDB 数据库中使用 Mongoos 的模拟器。它可以用来测试在使用 MongoDB 数据库的应用程序中使用 Mongoose 的模板功能。

    1 年前
  • Redux 实用技巧分享：如何使用 reselect 优化代码

    在前端开发中，我们经常会使用 Redux 进行状态管理。虽然 Redux 功能非常强大，但是在处理大量数据时，Redux 的性能可能会受到影响。这时候使用 reselect 库可以优化性能，提高代码的...

    1 年前
  • RxJS 的分治思维在数据流处理中的应用

    引言 在前端开发过程中，我们经常需要处理来自用户或服务端的大量数据。这些数据可能是异步的，不能直接使用传统的同步编程方式来处理。针对这种情况，RxJS 的出现解决了这个问题。

    1 年前
  • Redis 如何解决内存占用过高的问题？

    概述 Redis 是一款高性能的 key-value 存储系统，它以内存中的数据结构为基础，提供了诸如字符串、哈希表、列表、集合、有序集合等多种数据类型，支持丰富的操作。

    1 年前
  • Next.js 如何进行单元测试？

    前言 单元测试是指对软件中的最小可测试单元进行检查和验证，目的是为了发现问题并解决它们，提高代码的质量和可维护性。在前端领域中，由于界面交互的复杂性和后端 API 接口的多样性，单元测试变得尤为重要。

    1 年前
  • Custom Elements 库的用例和工作流程

    在现代前端开发中，组件化已经成为了一个必须掌握的技能。Custom Elements 是一种通过 JavaScript 来定义自定义元素的 API，并且可以在 DOM 树中使用这些自定义元素。

    1 年前

相关推荐

    暂无文章