Node.js 中使用 Passport 实现登录认证

随着互联网的快速发展,越来越多的网站需要用户登录认证功能。实现登录认证功能涉及到很多的安全问题,如果自己手写,需要考虑很多细节,十分繁琐且容易出现漏洞。Passport 是一个 Node.js 的登录认证中间件,它可以简化登录认证的流程并提供一套健壮的策略来保护网站的安全。本文将介绍如何使用 Passport 实现登录认证功能,并提供详细的代码示例。

环境准备

在开始使用 Passport 之前,需要先确保已经安装了 Node.js。在安装完成之后,可以使用 npm 包管理器来安装 Passport。

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

接着,需要根据具体的需求来安装对应的 Passport 策略。例如,如果需要使用本地账户密码来认证登录,需要安装 passport-local 策略。

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

如果需要使用第三方登录认证,需要安装对应的策略。例如,如果需要使用 Google 账号登录,需要安装 passport-google-oauth20 策略。

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

实现本地账户密码认证

本地账户密码认证是最常见的登录认证方式。下面将通过一个简单的示例来介绍如何使用 passport-local 策略来实现本地账户密码认证。首先,需要创建一个路由来处理登录请求。在这个路由中,需要使用 Passport 的 authenticate 函数来验证用户的账号密码是否正确。

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

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

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

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

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

上面的代码中,配置了一个本地策略来验证用户的账号密码,并且还定义了序列化和反序列化用户对象的方法。在处理登录请求的路由中,使用 authenticate 函数来调用 Passport 验证用户的账号密码是否正确。如果账号密码正确,会重定向到 /home 页面,否则会重定向到 /login 页面并提示用户名或密码错误。

在使用本地账户密码认证之前,还需要在 HTML 表单中添加用户名和密码的输入框,并将这些信息通过 POST 请求发送给后端的登录路由。例如:

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

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

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

在使用本地账户密码认证时,需要注意以下几点:

  1. authenticate 函数是 Passport 中的一个核心方法,它接收一个策略名称和一个可选的配置对象。在上面的示例中,策略名称是 'local',因为我们使用了 passport-local 策略来实现本地账户密码认证。

  2. 在处理登录请求的路由中,需要设置 successRedirect 和 failureRedirect 属性来分别指定认证成功和认证失败后的重定向页面。同时,还可以设置 failureFlash 属性来开启 Passport 的 flash message 功能,用于提示用户认证失败的原因。

  3. serializeUser 和 deserializeUser 方法是用于在 Passport 中序列化和反序列化用户对象。在上面的示例中,我们只是简单地通过 done 回调函数将用户对象序列化和反序列化了回来,实际项目中根据实际需求进行相应修改即可。

实现第三方认证

除了使用本地账户密码认证之外,Passport 还支持使用第三方登录认证,例如 Google、Facebook、Twitter 等。下面将通过一个简单的示例来介绍如何使用 passport-google-oauth20 策略来实现使用 Google 账号登录。首先,需要在 Google Cloud Console 中创建一个OAuth 2.0 客户端 ID,并将客户端 ID 和客户端密钥保存到环境变量中:

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

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

上面的代码中,首先使用 require 函数加载 passport 和 passport-google-oauth20 模块,然后使用 GoogleStrategy 构造函数创建一个 Google 策略并传递 clientID、clientSecret 和 callbackURL 等参数。在 Passport 验证通过后,会执行传递给 GoogleStrategy 构造函数的回调函数,并将 accessToken、refreshToken、profile 和 done 回调函数作为参数传递进去。在回调函数中可以根据 profile 中的信息验证用户是否合法,然后将合法的用户对象通过 done 回调函数传递给 Passport。

在创建 Google 策略完成之后,接下来需要创建两个路由用于处理 Google 账号登录。第一个路由用于重定向到 Google 登录页面:

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

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

在上面的示例中,我们定义了一个 /auth/google 路由,并使用了 passport.authenticate 函数来调用 GoogleStrategy 策略来认证用户。在 authenticate 函数的 options 中,需要配置 scope 属性来指定需要从 Google 获取的用户资料。在本例中,我们只获取用户的 profile 资料。

第二个路由用于处理 Google 账号登录认证成功后的回调函数:

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

在上面的示例中,如果 Google 账号登录认证通过,会将用户重定向到 /home 页面;否则会将用户重定向到 /login 页面。注意,这里的成功重定向页面和使用本地账户密码认证时是一样的。

在使用第三方认证时,需要注意以下几点:

  1. 要使用第三方认证,需要首先在对应的开发者平台上注册账号并创建一个 OAuth 2.0 应用。在完成相关配置之后,才能使用对应的策略实现第三方认证。

  2. Google、Facebook、Twitter 等第三方平台的授权方式略有不同,需要根据官方文档来选择对应的策略和配置方式。

  3. 回调函数中的 accessToken、refreshToken、profile 等参数都是由上游的策略传递下来的,需要根据具体需求来处理用户信息并调用 done 回调函数。

总结

本文介绍了在 Node.js 中使用 Passport 实现登录认证功能的方法,并提供了详细的代码示例。在使用 Passport 进行登录认证时,需要注意安装对应的策略、配置本地策略、序列化和反序列化用户对象、使用 authenticate 函数验证用户信息以及使用对应的路由来处理登录请求和认证回调等问题。通过上面的示例代码,相信读者能够掌握 Passport 的使用方法,并在实际项目中快速实现登录认证功能。

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


猜你喜欢

  • JavaScript 新手和开发者:入门指南(从 ES5 到 ES9)

    JavaScript 是一种广泛使用的脚本语言,主要用于在 Web 网站中实现交互性和动态性。随着 Web 技术的发展,JavaScript 的标准也在不断更新,为了让新手和开发者更好地理解和掌握 J...

    1 年前
  • ESLint 插件 eslint-plugin-import 的使用方法详解

    随着前端技术的不断发展,前端代码的复杂性也不断增加,为了提高代码的可读性和可维护性,代码规范的制定也变得越来越重要。而 ESLint 是当前最为流行的 JavaScript 代码规范检查工具之一,它提...

    1 年前
  • Fastify 实践:如何使用 fastify-multer 插件处理文件上传

    前言 在 Web 开发过程中,文件上传是很常见的需求。Fastify 是一个性能优秀的 Node.js Web 框架,它提供了丰富的插件扩展机制,可以轻松地实现文件上传功能。

    1 年前
  • 使用 Mocha 和 Chai 测试 AngularJS 指令的最佳实践

    本文介绍如何使用 Mocha 和 Chai 来测试 AngularJS 指令的最佳实践。Mocha 是一个 JavaScript 测试框架,Chai 是一个断言库。

    1 年前
  • 怎样用 CSS Reset 纠正 HTML 默认格式

    简介 在开发网站时,HTML 语言会自带一些默认样式,如字体、行高等。这些默认样式可能会对页面效果产生影响,因此需要通过 CSS Reset 进行重置。CSS Reset 是一种用于纠正 HTML 默...

    1 年前
  • 4 个 Enzyme 常见错误的解决方案

    Enzyme 是 React 组件测试的主要工具之一,但是在使用过程中我们可能会遇到一些问题。在本文中,我们将探讨 4 个常见的 Enzyme 错误和应对方案,帮助你更好地使用 Enzyme 进行测试...

    1 年前
  • 如何使用 Deno 处理文件流?

    Deno 是一种新的 JavaScript 和 TypeScript 运行时环境,它提供了一系列工具和 API,使得开发者能够更加容易地编写高效的 JavaScript 和 TypeScript 应用...

    1 年前
  • PM2 与 Express 的配合使用教程

    在前端开发中,我们经常需要运行 Web 服务器以测试应用程序。本文将介绍如何使用 PM2 与 Express 框架搭建可靠的 Web 服务器。 什么是 PM2? PM2 是一个 Node.js 进程管...

    1 年前
  • ES12 的 globalThis 新特性详解

    随着前端应用的复杂性不断增加,JavaScript 语言也在不断地演进和完善。ES12(ES2021)是 ECMAScript 的最新版本,它带来了很多新特性,其中一个重要的改进是 globalThi...

    1 年前
  • 解决在 ES8 中使用 async/await 时遇到的 5 个常见问题

    在现代编程中,异步编程已经成为了必不可少的一部分。ES8 中的 async/await 是一种更直观、更简洁的异步编程方式。然而,使用 async/await 时需要注意一些常见的问题。

    1 年前
  • 如何使用 webpack 实现 Code Splitting

    Code Splitting 是指将大型的 JavaScript 应用程序分解成更小的块,以便于更高效地加载和使用。在前端开发中,Code Splitting 是非常有用的,因为它可以显著减少网页的加...

    1 年前
  • Cypress 自动化测试实战:跨浏览器测试篇

    前言 Cypress 是一款现代化的前端自动化测试工具,它相较于其他测试框架,有着更加简单和直观的 API,能够轻松地编写、运行和调试测试用例。不仅如此,Cypress 还提供了一系列强大的功能,如智...

    1 年前
  • Jest 测试框架的整合和应用

    前言 在前端开发中,测试是非常重要的一个环节。测试可以保证代码的质量和稳定性,减少代码出现问题的几率,也能提高开发效率和代码的可维护性。在测试框架中,Jest 是一个很强大的框架,可以用来做单元测试、...

    1 年前
  • ES11 中的 Array.prototype.at 方法,解决 JavaScript 数组随机访问问题

    在 ES11 中,新增了 Array.prototype.at 方法,该方法可以通过下标访问数组中指定位置的元素,解决了 JavaScript 数组随机访问问题。在实际开发中,我们经常需要根据下标访问...

    1 年前
  • 如何使用 Hapi.js 和 Socket.io 实现实时监测系统

    随着互联网技术的不断发展,实时监测系统变得越来越重要。实时监测系统可以帮助我们实时了解业务状况,及时发现异常,提高效率和安全性。在本文中,我们将介绍如何使用 Hapi.js 和 Socket.io 实...

    1 年前
  • 利用 ES7 中的 Array.prototype.concat 方法实现数组合并

    利用 ES7 中的 Array.prototype.concat 方法实现数组合并 在前端开发中,操作数组是非常常见的事情,而数组合并是其中经常遇见的需求之一。在 ES6 中,我们可以使用展开运算符或...

    1 年前
  • 如何使用 Tailwind CSS 实现响应式导航栏

    在Web开发中,导航栏是网站或应用程序的关键部分之一。它允许用户在不同页面之间导航,并提供对网站的基本结构和主题的了解。随着移动设备的普及,响应式导航栏已经成为了现在Web开发必须关注的一个重点。

    1 年前
  • 使用 ES10 的可选链语法处理前端数据异常情况

    在前端开发中,经常会遇到访问嵌套对象或嵌套数组的情况,但有时候对象或数组中的一层或多层可能是 null 或 undefined,这时候我们需要对数据进行一些处理来避免程序崩溃。

    1 年前
  • RESTful API 中的 OAuth 2.0 授权流程详解

    在当今网络应用程序的发展中,需求越来越高,一些基于 RESTful API 构建的应用程序也逐步成为了主流。RESTful API 可以极大地简化开发过程,但同时也带来了安全问题。

    1 年前
  • RxJS 异步流程管理

    RxJS 是 Reactive Extensions for JavaScript 的缩写,它是一个基于观察者模式的异步流程管理库,可以帮助开发者更加方便地处理复杂的异步流程。

    1 年前

相关推荐

    暂无文章