GitHub 是全球最大的开源代码托管平台,有数百万的开发者在上面分享代码和协作开发。为了方便开发者登录和授权使用 GitHub,GitHub 提供了 OAuth2.0 授权登录机制,开发者可以使用现有的社交媒体账户登录 GitHub,也可以使用 GitHub 账户登录其他网站应用。本文将介绍如何使用 Express.js 框架实现 GitHub 登录。
1. 创建 OAuth 应用
在使用 GitHub OAuth 登录前,需要先创建一个 OAuth 应用。我们可以在 GitHub Developer Settings 的 OAuth Apps 页面创建一个新的 OAuth 应用,创建完成后会得到一个 Client ID 和一个 Client Secret,这两个参数是我们后面需要配置 OAuth 登录的必要参数。
2. 安装依赖库
使用 Express.js 实现 GitHub 登录需要安装几个必要的依赖库:
- express:一个流行的 Web 应用程序框架;
- express-session:在应用程序中设置会话;
- passport:一个 Node.js 的身份验证中间件,可以对多种网站的登录进行验证;
- passport-github2:一个 Passport 的 GitHub 验证策略,使用 GitHub OAuth2 API 进行身份验证;
- dotenv:从 .env 文件中读取环境变量。
你可以使用以下命令安装这些依赖库:
--- ------- ------- --------------- -------- ---------------- ------
3. 配置环境变量
在运行应用之前,需要设置一些环境变量,这可以使用 dotenv 库来实现。将以下内容添加到 .env 文件中:
------------------------------- --------------------------------------- ----------------------------------
将 your_client_id、your_client_secret 和 your_session_secret 替换为你创建的 OAuth 应用的 Client ID、Client Secret 和任意的 Session Secret。
4. 实现 GitHub 登录
首先,我们需要从passport和passport-github2库中导入所需的中间件和挂载它们:
----- -------- - -------------------- ----- -------------- - ------------------------------------- ------------------------------- ----------------------------
然后,我们需要配置passport的GitHub身份验证策略,这可以使用以下代码实现:
---------------- ---------------- --------- ----------------------------- ------------- --------------------------------- ------------ ----------------------- -- --------------------- ------------- -------- --- - ------ -------- --------- - ---
这里我们使用在 .env 文件中配置的环境变量来传递GitHub OAuth2的参数。在回调函数中,我们可以获取GitHub用户的访问令牌、刷新令牌和个人资料信息。
接下来,我们需要配置Express中间件来处理GitHub登录和callback请求:
----------------------- ------------------------------- - ------ - ------------ - ---- -------------------------------- ------------------------------- - ---------------- -------- --- ------------- ---- - -- ---------- --------------- -------- ----- ------------------ ---
这里,我们定义了两个路由,/auth/github 和 /auth/github/callback,对应于 GitHub 的 OAuth2 回调URL。在 /auth/github 路由中,我们通过passport.authenticate('github')中间件来处理GitHub登录请求。在/passport.authenticate('github', { failureRedirect: '/login' })中间件中处理callback请求,并在认证通过后重新定向到主页。
最后,我们需要使用Express会话中间件来实现会话状态的维护:
------------------------- ------- --------------------------- ------- ------ ------------------ ----- ----
5. 示例代码
----- ------- - ------------------- ----- -------- - -------------------- ----- -------------- - ------------------------------------- -------------------------- ----- --- - ---------- ---------------------------------- ------------------------ ---------------------------- --------- ----- ---- ------------------------- ------- --------------------------- ------- ------ ------------------ ----- ---- ------------------------------- ---------------------------- ------------------------------------- ----- - ---------- ------ --- --------------------------------------- ----- - ---------- ------ --- ---------------- ---------------- --------- ----------------------------- ------------- --------------------------------- ------------ ----------------------- -- --------------------- ------------- -------- --- - ------ -------- --------- - --- ------------ ----- ---- -- - -- ----------- - ----------------------- - ---- - ---------------------------- - - -------------------- - ----- - --- ----------------- ----- ---- -- - ---------------------------------- - --------------------- --- ----------------------- ------------------------------- - ------ - ------------ - ---- -------------------------------- ------------------------------- - ---------------- -------- --- ------------- ---- - -- ---------- --------------- -------- ----- ------------------ --- ---------------- -- -- ---------------- --------- -- ---- ---------
6. 总结
在本文中,我们使用 Express.js 实现了一个简单的 GitHub 登录应用程序。使用GitHub的OAuth2.0机制,我们可以为用户提供便捷的登录和授权系统,并为应用程序提供更多的数据来源。当然,这只是一个示例代码,我们可以根据实际需求进行修改和改进。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/64b42ce448841e9894048cd5