使用 Express.js 和 JWT 实现身份验证

身份验证是任何应用程序中的重要部分,特别是在 Web 应用程序中。在 Web 应用程序中,身份验证是确保用户是谁他们声称自己是的过程。在本文中,我们将使用 Express.js 和 JWT(JSON Web Tokens)来实现身份验证。

什么是 Express.js?

Express.js 是一个基于 Node.js 平台的 Web 应用程序框架。它提供了一组强大的功能,使开发人员能够轻松地构建 Web 应用程序。它是一个灵活的框架,可以通过添加中间件来扩展其功能。

什么是 JWT?

JSON Web Tokens(JWT)是一种开放标准(RFC 7519),它定义了一种紧凑且自包含的方式来表示信息。它是一种安全的方式,用于在网络上传输信息,因为它可以通过数字签名进行验证和信任。

JWT 由三部分组成:标头、负载和签名。标头包含有关令牌的元数据,例如令牌的类型和算法。负载包含有关令牌的信息,例如用户 ID、过期时间和其他元数据。签名是一个数字签名,用于验证令牌是否被篡改。

实现身份验证

在本文中,我们将使用 Express.js 和 JWT 实现身份验证。我们将创建一个简单的 Web 应用程序,该应用程序允许用户注册、登录和查看其个人资料。

安装依赖

在开始之前,我们需要安装一些依赖项。我们将使用 Express.js、jsonwebtoken、bcrypt 和 body-parser。打开终端并运行以下命令:

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

创建服务器

我们将从创建一个简单的服务器开始。在项目根目录中创建一个名为 server.js 的文件,并添加以下代码:

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

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

这将创建一个监听端口为 3000 的服务器。我们可以通过运行以下命令来启动服务器:

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

注册用户

现在,我们将创建一个端点,该端点允许用户进行注册。我们将使用 bcrypt 来加密用户的密码,并将用户信息保存在数据库中。在 server.js 文件中添加以下代码:

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

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

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

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

这将创建一个名为 /register 的端点,该端点将用户信息保存在数组中。我们使用 bcrypt 来加密密码,并使用 async/await 来等待哈希密码的完成。如果发生错误,我们将发送一个 500 错误响应。

登录用户

现在,我们将创建一个端点,该端点允许用户进行登录。在 server.js 文件中添加以下代码:

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

这将创建一个名为 /login 的端点,该端点将检查用户是否存在,然后检查密码是否匹配。我们使用 bcrypt.compare 来比较密码,并返回一个成功或失败的响应。

生成 JWT

现在,我们将生成一个 JWT,该 JWT 包含用户 ID 和用户名。在 server.js 文件中添加以下代码:

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

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

这将创建一个名为 /login 的端点,该端点将生成一个 JWT 并将其发送回客户端。我们使用 jwt.sign 来生成 JWT,其中包含用户名和一个秘密密钥。我们将 JWT 发送回客户端,以便客户端可以在以后的请求中使用它进行身份验证。

验证 JWT

现在,我们将创建一个中间件,该中间件将验证 JWT 并确保用户已经登录。在 server.js 文件中添加以下代码:

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

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

这将创建一个名为 authenticateToken 的中间件,该中间件将检查 JWT 是否存在并是否有效。如果 JWT 不存在或无效,则中间件将发送 401 或 403 响应。如果 JWT 有效,则中间件将将用户添加到请求中,并将请求传递给下一个处理程序。

我们还创建了一个名为 /profile 的端点,该端点需要进行身份验证。如果 JWT 有效,则端点将返回用户的个人资料。

总结

在本文中,我们使用 Express.js 和 JWT 实现了身份验证。我们创建了一个简单的 Web 应用程序,该应用程序允许用户进行注册、登录和查看其个人资料。我们使用 bcrypt 来加密密码,并使用 JWT 来进行身份验证。这个应用程序可以作为一个很好的起点,用于构建更复杂的 Web 应用程序。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/65cd8bb4add4f0e0ff6c3b3e


猜你喜欢

  • Flexbox 和 Grid 布局的不同及如何选择使用

    前言 在前端开发中,布局是非常重要的一环。而在布局中,有两种比较常用的方式,分别是 Flexbox 和 Grid 布局。两者都有其独特的优点和适用场景,本文将详细介绍两种布局的不同之处以及如何选择使用...

    8 个月前
  • ES9:使用 Object.fromEntries() 在 JavaScript 中快速生成对象

    在 JavaScript 中,我们经常需要创建对象。ES9 引入了一个新的方法,Object.fromEntries(),它可以让我们更加快速地创建对象。本文将介绍 Object.fromEntrie...

    8 个月前
  • ES6 中 async/await 的使用及处理错误的方法

    在现代前端开发中,异步编程是非常常见的。ES6 中引入了 async/await,提供了一种更加优雅的异步编程方式。本文将介绍 async/await 的使用方法以及如何处理错误。

    8 个月前
  • ES8 中新增的函数式编程方法 flatMap() 简化代码

    在 ES8 中,新增了一个函数式编程方法 flatMap(),它可以帮助我们更加简化代码,提高代码的可读性和可维护性。本文将详细介绍 flatMap() 的用法和实际应用场景,希望能够对前端开发者有所...

    8 个月前
  • 如何在 VS Code 中使用 LESS

    LESS 是一种 CSS 预处理器,它可以让我们使用类似编程语言的方式来编写 CSS,包括变量、函数、嵌套等功能,让 CSS 更加灵活和易于维护。在前端开发中,使用 LESS 可以提高开发效率和代码质...

    8 个月前
  • Kubernetes 集群中的高可用 HA 实现方案

    Kubernetes 是一个流行的容器编排平台,可用于自动化应用程序的部署、扩展和管理。在生产环境中,需要确保 Kubernetes 集群的高可用性(HA),以确保应用程序的稳定性和可靠性。

    8 个月前
  • ECMAScript 2016 里的 Proxy 实践与实现详解

    Proxy 是 ECMAScript 2016 中新增的一个特性,它可以让开发者在访问对象时拦截并自定义行为。这个特性可以用于很多场景,比如数据绑定、数据校验、缓存等。

    8 个月前
  • 从头开始构建一个基于 Fastify 的 REST API

    随着互联网的发展,REST API 已经成为了前端开发中不可或缺的一部分。它可以让前端开发者与后端开发者分离开来,让前端开发者可以更加专注于用户界面的设计和交互,而不用过多关注后端业务逻辑的实现。

    8 个月前
  • Hapi 项目中如何使用 Nodemailer 发送邮件

    在开发 Web 应用程序时,发送电子邮件是非常常见的需求。在 Hapi 项目中,我们可以使用 Nodemailer 库来方便地发送电子邮件。本文将介绍如何在 Hapi 项目中使用 Nodemailer...

    8 个月前
  • Serverless 框架的易用性与应用

    Serverless 架构是近年来备受关注的一种全新的云计算架构,它最大的特点是将应用程序的部署和运行从底层的服务器上抽象出来,使得开发者可以专注于业务逻辑的实现,而无需关心服务器的配置、维护等繁琐工...

    8 个月前
  • 利用 Custom Elements 协议实现高度可定制化的 HTML 标签

    在前端开发中,我们经常需要创建自定义的 HTML 标签来满足特定的需求。传统的做法是使用 JavaScript 来动态创建和修改标签,但这种方式存在一些问题,如可维护性差、重复代码多等。

    8 个月前
  • Cypress 测试中如何处理 ajax 请求?

    Cypress 是一个流行的前端自动化测试框架,它可以帮助开发人员和测试人员轻松地编写和运行测试用例。在实际测试中,我们经常需要处理 ajax 请求,以确保测试用例的准确性和稳定性。

    8 个月前
  • SSE 在你的应用可以提升的性能和效果

    SSE 在你的应用可以提升的性能和效果 SSE,即 Server-Sent Events,是一种基于 HTTP 协议的服务器推送技术。它可以让服务器主动向客户端推送数据,而不需要客户端发起请求。

    8 个月前
  • RxJS 中快速掌握如何组合多个 observable 数据

    RxJS 是一个用于处理异步数据流的 JavaScript 库。它提供了一种响应式编程的方式来处理数据,使得代码更加简洁易读,并且更容易管理异步数据。在 RxJS 中,我们可以使用各种操作符来组合多个...

    8 个月前
  • Ant Design Pro 与 React 技术栈

    Ant Design Pro 是一个基于 Ant Design 设计体系的开箱即用的中后台前端/设计解决方案。它集成了大量的常用组件和模块,可以快速搭建出高质量的中后台应用。

    8 个月前
  • 在 Gatsby.js 项目中使用 Tailwind 样式

    Tailwind 是一种基于原子类的 CSS 框架,它提供了一组可重用的 CSS 类,可以轻松创建复杂的布局和样式。在 Gatsby.js 项目中使用 Tailwind 可以提高开发效率和代码质量,本...

    8 个月前
  • Koa2 中使用 Sequelize 操作表之外键关联的方法

    在开发 Web 应用程序时,操作数据库是必不可少的一部分。Sequelize 是一个强大的 ORM(对象关系映射)库,它支持多种数据库,包括 MySQL、PostgreSQL、SQLite 和 MSS...

    8 个月前
  • 在 Express.js 应用程序中处理 POST 请求

    在 Web 开发中,POST 请求是非常常见的一种请求方式。在 Express.js 应用程序中,我们需要对 POST 请求进行处理,以便能够获取请求中的数据并进行相应的处理。

    8 个月前
  • ECMAScript 2020: WeakSet 和 WeakMap 的使用及场景

    在 ECMAScript 2020 中,新增了 WeakSet 和 WeakMap 两个数据结构,它们的存在使得我们在某些场景下更加方便地管理数据。本文将介绍 WeakSet 和 WeakMap 的使...

    8 个月前
  • Webpack 使用 babel-preset-es2015 没必要启用全部特性

    Webpack 使用 babel-preset-es2015 没必要启用全部特性 前言 在前端开发中,Webpack 是一个非常流行的模块打包器,而 Babel 则是一个 JavaScript 编译器...

    8 个月前

相关推荐

    暂无文章