在前端开发中，实现社交登录的功能是常见的需求，在Facebook用户登录中，npm包passport-facebook是一个非常好的选择。本文将对其进行详细的使用教程。
什么是 Passport？
在 Node.js 中，Passport 是一个非常流行的认证框架。它允许我们以可扩展的方式将任何类型的认证集成到我们的应用程序中，包括本地认证（用户名和密码）、社交登录以及OAuth等。
安装 Passport-Facebook 包
首先，我们需要安装 passport 和 passport-facebook：
npm install passport npm install passport-facebook
创建应用并获取 Facebook 应用凭证
在我们开始配置 passport-facebook 之前，我们需要创建 Facebook 开发人员应用程序。登录到 https://developers.facebook.com/，创建一个新应用程序并选择“Web”应用程序类型。
一旦应用程序创建成功，你将得到一个应用程序 ID 和应用程序机密。我们需要这些凭证来配置 passport-facebook。
配置 Passport-Facebook
创建一个名为 auth.js 的新文件，并在文件中添加以下内容：
-- -------------------- ---- -------
--- -------- - --------------------
--- ---------------- - --------------------------------------
--- ---------- - ----------------------------
---------------- ------------------
--------- ---------------------------------
------------- -------------------------------------
------------ -----------------------------------
--
--------------------- ------------- -------- ----- -
--------------------------- -
------ ---------- ---------
---
----该配置将 passport-facebook 添加到我们的应用程序中，并使用我们从 Facebook 开发人员面板获取到的应用程序凭证。我们还定义了回调 URL，这是 Facebook 登录成功后应该跳转到的页面。
创建路由
现在我们需要为 Facebook 登录创建一个路由。我们需要创建一个名为 index.js 的新文件，并在文件中添加以下内容：
-- -------------------- ---- -------
--- ------- - -------------------
--- -------- - --------------------
--- ------ - -----------------
---------------------------- -----------------------------------
-------------------------------------
--------------------------------- -
---------------- -----------
---------------- ---
--
--
-------------- - -------这里我们仅仅指定了两个路由，第一个路由用来跳转到 Facebook 登录页面，并指定了 passport.authenticate("facebook") 作为中间件，这是认证的主要功能。第二个路由用于处理 Facebook 回调，当用户成功登录并授权之后，将执行后续操作。
编写配置文件
现在我们需要添加一个名为 auth.js 的配置文件，用于定义我们的 Facebook 应用程序的凭证和回调 URL。打开 auth.js 文件，添加以下内容：
module.exports = {
"facebookAuth": {
"clientID": "FB_APP_ID",
"clientSecret": "FB_APP_SECRET",
"callbackURL": "http://localhost:3000/auth/facebook/callback"
}
}请务必将 FB_APP_ID 和 FB_APP_SECRET 更改为你在 Facebook 开发人员面板中创建的应用程序 ID 和机密。这里我们也将定义我们绑定的回调 URL。
启动应用程序
现在我们已经完成了所有配置，我们可以启动我们的应用程序：
npm start
我们应用程序启动后，访问 http://localhost:3000/auth/facebook 将打开 Facebook 登录页面，当我们成功登录并授权后，将被重定向到 http://localhost:3000/profile。
总结
在本文中，我们学习了如何使用 passport-facebook 实现Facebook社交登录的功能。我们需要创建 Facebook 开发人员应用程序，并获取应用程序 ID 和应用程序机密，然后进行配置和添加路由。通过使用 Passport，我们可以更轻松地将认证集成到我们的应用程序中。
示例代码已上传到GitHub：
https://github.com/imRobotAI/npm-passport-facebook-tutorial.git
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/69525