如何使用 Node.js 和 Express 创建一个简单的登录认证系统？

在现代 Web 应用程序中，安全是非常重要的。保护用户的访问仅允许授权的人员并限制非授权的访问者非常重要。为此，现在很多 Web 应用程序都会有用户登录认证系统。

在本文中，我们将讨论如何使用 Node.js 和 Express 创建一个简单的登录认证系统。

安装 Node.js 和 Express

首先，您需要确保已经安装了 Node.js 和 Express。如果您还没有安装，可以按照以下步骤进行操作：

  1. 前往 Node.js 官网 https://nodejs.org/en/download/ 下载 Node.js。
  2. 打开命令行终端并输入以下命令来安装 Express： npm install express

创建一个 Express 应用

现在，我们将创建一个 Express 应用程序来实现用户的登录认证系统。首先，在您的本地计算机上创建一个名为 login-app 的新目录，并通过以下命令初始化 npm 项目：

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

接下来，安装 Express 和几个其他必要的依赖项：

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

设置数据库

我们使用 MongoDB 来存储用户的信息。以下是如何安装和启动 MongoDB 的步骤：

  1. 前往 MongoDB 官网 https://www.mongodb.com/try/download/community 下载 MongoDB。
  2. 打开命令行终端并输入以下命令来启动 MongoDB：mongod

现在，我们可以创建一个名为 login-app 的 MongoDB 数据库，并在其中创建一个名为 users 的集合来存储用户信息。

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

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

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

设置 Express 应用程序

我们需要创建 app.js 文件来设置 Express 应用程序，并实现登录认证系统。

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

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

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

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

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

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

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

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

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

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

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

在这个文件中，我们：

  1. 引入必要的依赖项（express、session、passport、passport-local、User 模型和 db.js）。
  2. 设置 Express 中间件（json、urlencoded、session）。
  3. 实现 passport-local 策略 LocalStrategy，用于对用户进行身份验证。
  4. 设置 passport 的序列化和反序列化函数。
  5. 配置路由 GET /、GET /login、POST /login 和 GET /logout，以实现完整的登录认证系统。

创建 User 模型

现在，我们需要定义一个 User 模型来存储用户信息。创建 user.js 文件并定义模型如下：

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

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

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

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

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

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

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

在这个文件中，我们：

  1. 引入必要的依赖项（mongoose 和 bcrypt）。
  2. 定义 User 模型。
  3. 实现 pre 钩子函数，在保存之前对密码进行哈希化。
  4. 实现 validPassword 方法，用于验证用户密码的正确性。

测试登录认证系统

运行以下命令来启动应用程序：

---- ------

现在可以在浏览器中打开 http://localhost:3000。当您尝试访问首页时，您将被重定向到登录页面。输入用户名和密码，然后单击“登录”按钮。如果您提供的信息正确，则应将您重定向到主页。

到此，就完成了使用 Node.js 和 Express 创建一个简单的登录认证系统的步骤。

总结

在本文中，我们讨论了如何使用 Node.js 和 Express 创建一个简单的登录认证系统。我们学习了如何使用 Passport 和 Passport-local 来实现登录认证系统，并学习了一些有用的密码安全实践。我们也学习了如何使用 MongoDB 存储用户信息。

我希望本文对您有所帮助。如果您有任何问题或建议，请在下面的评论中提出。

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

阅读全文

猜你喜欢

  • Kubernetes 下 Nginx-ingress-controller 部署

    在 Kubernetes 集群中，Nginx-ingress-controller 是一个常用的 Ingress 控制器。它可以用来将外部请求路由到正确的 Kubernetes Service 的后端...

    1 年前
  • Web Components 中如何实现拖放功能？

    Web Components 中如何实现拖放功能？ 随着 Web 技术的发展，Web Components 作为一种新的 Web 开发方式，受到了越来越多前端开发者的关注。

    1 年前
  • 解决使用 LESS 时出现的 border-radius 样式错误问题

    在前端开发中，我们经常会使用 LESS 来管理样式，它可以让我们更方便地管理样式变量、混合、嵌套等。但是，在使用 LESS 过程中，有时会遇到 border-radius 样式错误的问题。

    1 年前
  • 使用 Mocha 和 WebdriverIO 进行前端自动化测试的实践

    前端自动化测试是保证产品质量的重要手段之一，可以有效地降低测试成本和提升测试效率。本文将介绍使用 Mocha 和 WebdriverIO 进行前端自动化测试的实践，让你快速掌握这两个工具的使用方法，并...

    1 年前
  • 如何在 Express.js 中配置 HTTPS

    在今天的网络世界中，安全性逐渐成为越来越多人关注的话题。如果您在使用 Express.js 搭建的网站中涉及到敏感信息，那么为您的网站配置 HTTPS 协议，可以保证网络传输过程中的数据安全性。

    1 年前
  • ES6 中如何使用 Object.setPrototypeOf 实现原型链修改

    ES6 中如何使用 Object.setPrototypeOf 实现原型链修改 在 JavaScript 中，原型链是非常重要的一个概念，它是实现继承的核心机制之一。

    1 年前
  • CSS Flexbox 的 Align-items 属性使用教程

    CSS Flexbox 的 Align-items 属性使用教程 在前端开发过程中，CSS 布局一直是一个重要的话题。其中，Flexbox 布局技术是最常用的一种布局技术。

    1 年前
  • React Native 实现 Native 模块开发

    React Native 是一种用于构建原生移动应用程序的 JavaScript 框架，它可以将组件直接映射到原生视图，使得应用程序的性能和交互性能更加优秀。但是开发过程中，我们有时需要使用一些 Na...

    1 年前
  • Headless CMS 系统中如何进行数据量优化？

    Headless CMS 系统中如何进行数据量优化？ 在Web开发领域，CMS 是一个非常常见的概念，它代表 Content Management System（内容管理系统）。

    1 年前
  • 利用 Babel 支持 ES6 对非模块化的 JS 文件进行模块化打包

    利用 Babel 支持 ES6 对非模块化的 JS 文件进行模块化打包 前言 随着前端开发技术的不断发展，ES6 已经逐渐成为了前端开发的一个必备基础知识点。而一些旧的项目或者库却无法使用 ES6 的...

    1 年前
  • 解析 RESTful API 中的 JSON 数据格式

    在前端开发中，我们经常会使用 RESTful API 搭建后端服务并传输数据。而在传输数据的过程中，大多采用 JSON 格式。如何正确解析 JSON 数据，则成为了前端开发的重要问题。

    1 年前
  • ESLint 如何检查函数是否有返回值

    ESLint 是一个开源的 JavaScript 代码检查工具，它能够帮助前端开发者在代码编写过程中发现常见的代码错误，并且还支持多种自定义规则的开发，以适应团队的具体需求。

    1 年前
  • 如何在 Sequelize 中使用事务来控制数据库交易

    在进行数据库交易时，我们经常需要考虑事务的使用。事务可以确保在某些操作失败时回滚所有对数据库的更改，从而避免数据不一致的问题。在 Sequelize 中，我们可以使用事务来控制数据库交易。

    1 年前
  • RxJS 中 zip 的原理及实现方式

    前言 在 RxJS 中，zip 是一个非常有用的操作符，它可以将多个 Observable 按照顺序一一对应，从而得到一个新的 Observable。这个新的 Observable 会在每个源 Obs...

    1 年前
  • Web 与 PWA 架构设计方案比较

    引言 Web 应用一直是互联网世界的重要组成部分，但是原生应用和 PWA 已经在移动端开始逐渐风靡。那么，PWA 和传统的 Web 应用相比，架构设计方案有哪些不同呢？对于前端开发者来说，应该如何根据...

    1 年前
  • ECMAScript 2021（ES12）中Generator的使用详解

    Generator是JavaScript中一个比较特殊的函数，它可以被暂停和恢复，并且可以在不阻塞当前线程的情况下，将反复和异步代码转换为同步代码执行。 在ES6之前，JavaScript中没有这样的...

    1 年前
  • Promise 在 CSS3 动画中的应用实例分享

    在前端动画开发中，我们经常需要运用 CSS3 实现动画效果。但在实际操作过程中，经常会遇到异步的情况，例如当我们需要按顺序加载多个 CSS3 动画时，每个动画结束后，才能顺序执行下一个动画。

    1 年前
  • ES10 采用的新正则特性解析及使用教程

    ES10 采用的新正则特性解析及使用教程 正则表达式是前端开发中常用的一种技术。ES10 中新增了一些新的正则特性，本篇文章就来详细解析这些新特性，并提供相应的使用教程与示例代码。

    1 年前
  • 在 Fastify 框架中使用 Websockets 搭建聊天室

    前言 在前端开发中，使用 Websockets 技术实现实时通讯功能已经成为了一种常见的需求，而 Fastify 是一个高效且易用的 Node.js Web 开发框架，它的设计目标是提供一种基于 Ty...

    1 年前
  • Web Components 实现一个带图片的轮播组件

    Web Components 是一种通过组合原生 HTML、CSS 和 JavaScript 的方式开发可重用的用户界面组件的技术。它使得前端开发人员可以通过封装可重复使用的功能和界面，使得整个项目的...

    1 年前

相关推荐

    暂无文章