在 Web 开发中，第三方登录功能已经成为了必不可少的一部分，因为这项功能可以帮助用户快速注册和登录，同时也是提高用户体验的一种方式。在本文中，我们将介绍如何使用 Fastify 和 OAuth 实现第三方登录。
什么是 OAuth？
OAuth 是一个开放标准协议，它允许用户授权第三方应用程序访问他们存储在另一个服务提供商上的信息。通过 OAuth，用户不需要提供他们的用户名和密码给第三方应用程序，可以通过授权码或令牌安全地与不同的应用程序进行通信。
Fastify 简述
Fastify 是一个快速和低开销的 Web 框架，可以轻松地编写高性能的 Node.js 应用程序。它提供了一个灵活的插件体系结构，可以根据需要自定义其功能，而且其路由功能非常强大，几乎可以处理各种 Web 应用程序的需求。
安装 Fastify
在终端中输入以下命令以全局安装 Fastify：
--- ------- -- -------
在本节中，我们将介绍如何使用 Fastify 和 OAuth 实现第三方登录。
步骤 1：创建 OAuth 应用程序
在开始之前，您需要在您选择的 OAuth 提供商上创建一个应用程序。例如，您可以在 Google，Facebook 或 GitHub 上创建您自己的 OAuth 应用程序。在这里，我们将使用 GitHub 作为我们的 OAuth 提供商。
首先，登录到您的 GitHub 帐户并转到 Settings（设置）页面。在左侧导航菜单中，单击 Developer settings（开发人员设置），然后单击 OAuth Apps（OAuth 应用程序）。接着，单击 New OAuth App（新建 OAuth 应用程序）。
在 OAuth 应用程序设置页面上，您需要输入 “Application name”（应用程序名称）和 “Homepage URL”（主页 URL）等信息，然后单击 “Register application”（注册应用程序）按钮。在下一页上，您将看到生成的 “Client ID”（客户端 ID）和 “Client secret”（客户端密钥）凭证。请记下这些凭证，因为我们下面会用到。
步骤 2：安装依赖项
在本步骤中，您需要使用 npm 安装以下依赖项：
fastify：主题框架fastify-cors：用于跨域请求fastify-auth0-verify：用于验证访问令牌got：用于 HTTP 请求
输入以下命令以安装这些依赖项：
--- ------- ------- ------------ -------------------- ---
步骤 3：编写 Fastify 应用程序
打开您的编辑器并创建一个新的 index.js 文件并编写以下代码：
----- ------- - --------------------
------- -----
---
----- ---- - -----
----- ---- - ----------
----------------------------------------- -
------- -----
---
------------------------------------------------- -
------- ----------------------
--------- ------------------------
---
---------------- ----- -- -- -
------ - -------- ------ ------- --
---
---------------------------- ----- ----- ---- -- -
-------------
-------------------------------------------------------------------------------------------------------------------------
--
---
------------------------------- ----- ----- ---- -- -
----- - ---- - - ----------
----- - ------------ - - ----- ---------
----------------------------------------------
-
-------- -
------- -------------------
--
----- -
---------- -------------------
-------------- -----------------------
-----
--
-
---------
----- - ----- - - ----- --------
------------------------------
-
-------- -
-------------- ------- -----------------
------- -------------------
--
-
---------
------ -------- -----------
---
-------------------- ----- ----- -------- -- -
-- ----- -
-----------------------
----------------
-
------------------------ --------- -- -------------
---在上面的代码中，我们首先创建了一个 Fastify 实例，然后将其设置为监听端口 3000 和主机 0.0.0.0。接着，我们使用 fastify-cors 插件来处理跨域请求。然后，我们使用 fastify-auth0-verify 插件来验证访问令牌。最后，我们使用传统的 HTTP 路由方式来分别定义 /、/github/login 和 /github/callback 路径上的处理程序。
在 '/github/login' 路径处理程序中，我们使用 res.redirect() 将用户重定向到 GitHub OAuth 授权页面上，我们需要提供 client_id 和 redirect_uri 参数。然后，当用户完成授权后，GitHub 将其重定向到我们定义的 /github/callback 路径上。
在 '/github/callback' 路径处理程序中，我们首先获取用户的 code，然后使用该 code 获取访问令牌。然后，我们使用该访问令牌从 GitHub 获取用户详细信息，并将其返回给用户。
步骤 4：运行应用程序
最后，我们需要运行应用程序并在浏览器中访问 http://{your-host}:{your-port}/github/login，然后按照屏幕上的说明完成 GitHub OAuth 授权。完成授权后，您将被重定向到 /github/callback，并从 GitHub 获得用户详细信息。
您可以根据需要使用其他 OAuth 提供商来扩展此示例，例如 Google 或 Facebook。
结论
在本文中，我们使用 Fastify 和 OAuth 实现了第三方登录功能。通过本文，您学习到了如何使用 Fastify 实现一个简单的 Web 应用程序，以及如何使用 OAuth 认证获取用户详细信息。本文还提供了完整的示例代码，以方便您快速上手使用。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/671d46fe9babaf620fb55c45