使用Node.js實現(xiàn)GitHub登錄功能
在 Node.js 中實現(xiàn) GitHub 登錄功能,通常需要使用 OAuth 2.0 協(xié)議。GitHub 提供了 OAuth 認證機制,用戶可以通過 GitHub 登錄授權(quán)應(yīng)用訪問其數(shù)據(jù)。以下是實現(xiàn) GitHub 登錄的步驟。
我們將使用 passport 中間件和 passport-github2 策略來簡化 OAuth 認證流程。
1. 安裝所需的 npm 包
首先,創(chuàng)建一個新的 Node.js 項目并安裝必需的依賴:
npm init -y npm install express passport passport-github2 express-session dotenv
express: 用于構(gòu)建 web 應(yīng)用。passport: 用于認證的中間件。passport-github2: GitHub 的 OAuth 認證策略。express-session: 用于管理會話。dotenv: 用于管理環(huán)境變量。
2. 配置 GitHub OAuth 應(yīng)用
在 GitHub 上創(chuàng)建 OAuth 應(yīng)用并獲取 Client ID 和 Client Secret,步驟如下:
點擊 "New OAuth App" 按鈕。
填寫以下信息:
- Application Name:應(yīng)用名稱(例如:"MyApp")。
- Homepage URL:應(yīng)用主頁的 URL(例如:
http://localhost:3000)。 - Authorization callback URL:回調(diào) URL(例如:
http://localhost:3000/auth/github/callback)。
點擊 Register Application。
你會獲得 Client ID 和 Client Secret,這些需要在代碼中使用。
3. 配置 .env 文件
在項目根目錄下創(chuàng)建一個 .env 文件,存儲 GitHub 的 Client ID 和 Client Secret。
GITHUB_CLIENT_ID=your-client-id GITHUB_CLIENT_SECRET=your-client-secret GITHUB_CALLBACK_URL=http://localhost:3000/auth/github/callback SESSION_SECRET=your-session-secret
4. 創(chuàng)建 app.js 文件并實現(xiàn) OAuth 登錄
創(chuàng)建 app.js 文件并編寫以下代碼:
const express = require('express');
const passport = require('passport');
const session = require('express-session');
const dotenv = require('dotenv');
const GitHubStrategy = require('passport-github2').Strategy;
dotenv.config();
const app = express();
const port = 3000;
// 設(shè)置會話中間件
app.use(session({
secret: process.env.SESSION_SECRET,
resave: false,
saveUninitialized: true
}));
// 初始化 Passport
app.use(passport.initialize());
app.use(passport.session());
// 配置 Passport 使用 GitHub OAuth 2.0 策略
passport.use(new GitHubStrategy({
clientID: process.env.GITHUB_CLIENT_ID,
clientSecret: process.env.GITHUB_CLIENT_SECRET,
callbackURL: process.env.GITHUB_CALLBACK_URL
}, function(accessToken, refreshToken, profile, done) {
// 在此處可以將 GitHub 用戶信息存儲到數(shù)據(jù)庫
return done(null, profile);
}));
// 序列化用戶到 session 中
passport.serializeUser(function(user, done) {
done(null, user);
});
// 反序列化用戶
passport.deserializeUser(function(user, done) {
done(null, user);
});
// 路由:跳轉(zhuǎn)到 GitHub 登錄頁面
app.get('/auth/github', (req, res) => {
passport.authenticate('github', { scope: ['user:email'] })(req, res);
});
// 路由:GitHub 登錄回調(diào)
app.get('/auth/github/callback', (req, res) => {
passport.authenticate('github', { failureRedirect: '/' })(req, res, function() {
res.redirect('/profile');
});
});
// 路由:用戶個人資料頁面
app.get('/profile', (req, res) => {
if (!req.isAuthenticated()) {
return res.redirect('/');
}
res.json(req.user); // 返回用戶信息
});
// 路由:退出登錄
app.get('/logout', (req, res) => {
req.logout(function(err) {
res.redirect('/');
});
});
// 路由:首頁
app.get('/', (req, res) => {
if (req.isAuthenticated()) {
return res.redirect('/profile');
}
res.send('<a href="/auth/github" rel="external nofollow" >Login with GitHub</a>');
});
// 啟動服務(wù)器
app.listen(port, () => {
console.log(`Server is running at http://localhost:${port}`);
});
代碼解釋:
- GitHub OAuth 配置:通過
passport-github2策略配置 GitHub OAuth 認證,使用Client ID和Client Secret進行認證。 /auth/github:此路由用于觸發(fā) GitHub 登錄流程,用戶點擊鏈接后,會被重定向到 GitHub 登錄頁面。/auth/github/callback:GitHub 會回調(diào)此路由,將認證信息傳遞給應(yīng)用。如果認證成功,用戶信息將會存儲在req.user中,并跳轉(zhuǎn)到/profile頁面。/profile:如果用戶已經(jīng)登錄,將顯示用戶的 GitHub 個人資料。/logout:用于用戶退出登錄。passport.serializeUser和passport.deserializeUser:這兩個方法將用戶信息存儲到會話中。
5. 啟動應(yīng)用并測試
啟動 Node.js 應(yīng)用:
node app.js
打開瀏覽器,訪問 http://localhost:3000。
點擊 Login with GitHub,GitHub 將提示你授權(quán)應(yīng)用。
完成授權(quán)后,你將被重定向到 /profile 頁面,顯示你的 GitHub 用戶信息。
6. 處理認證失敗和錯誤(可選)
你可能需要在認證失敗時提供合適的反饋,可以在 passport.authenticate 中設(shè)置 failureRedirect:
app.get('/auth/github/callback', (req, res) => {
passport.authenticate('github', { failureRedirect: '/' })(req, res, function() {
res.redirect('/profile');
});
});
如果認證失敗,用戶將被重定向到首頁。
7. 保護路由(可選)
你可以通過 req.isAuthenticated() 來檢查用戶是否已認證,如果沒有認證,則重定向到登錄頁面。
app.get('/profile', (req, res) => {
if (!req.isAuthenticated()) {
return res.redirect('/');
}
res.json(req.user); // 返回用戶信息
});
總結(jié)
通過上述步驟,你已經(jīng)成功地在 Node.js 中實現(xiàn)了 GitHub 登錄。使用 Passport 和 passport-github2 策略簡化了 OAuth 認證流程。你可以根據(jù)需要擴展功能,比如存儲用戶數(shù)據(jù)、處理登錄狀態(tài)等。
到此這篇關(guān)于使用Node.js實現(xiàn)GitHub登錄功能的文章就介紹到這了,更多相關(guān)Node.js GitHub登錄內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
關(guān)于訪問node?express中的static靜態(tài)文件方法
這篇文章主要介紹了關(guān)于訪問node?express中的static靜態(tài)文件方法,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-09-09
利用node實現(xiàn)一個批量重命名文件的函數(shù)
這篇文章主要給大家介紹了關(guān)于利用node實現(xiàn)一個批量重命名文件的函數(shù)的相關(guān)資料,文中通過示例示例代碼介紹的非常詳細,對大家學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧。2017-12-12
Node.js使用NodeMailer發(fā)送郵件實例代碼
本篇文章主要介紹了Node.js使用NodeMailer發(fā)送郵件實例代碼,具有一定的參考價值,有興趣的可以了解一下。2017-03-03
node.js基于dgram數(shù)據(jù)報模塊創(chuàng)建UDP服務(wù)器和客戶端操作示例
這篇文章主要介紹了node.js基于dgram數(shù)據(jù)報模塊創(chuàng)建UDP服務(wù)器和客戶端操作,結(jié)合實例形式分析了node.js使用dgram數(shù)據(jù)報模塊創(chuàng)建UDP服務(wù)器和客戶端,以及進行UDP廣播、組播相關(guān)操作技巧,需要的朋友可以參考下2020-02-02
詳解通過源碼解析Node.js中cluster模塊的主要功能實現(xiàn)
這篇文章主要介紹了詳解通過源碼解析Node.js中cluster模塊的主要功能實現(xiàn),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
詳解如何使用node.js的開發(fā)框架express創(chuàng)建一個web應(yīng)用
這篇文章主要介紹了詳解如何使用node.js的開發(fā)框架express創(chuàng)建一個web應(yīng)用,網(wǎng)上各種搜索后,整理了下快速搭建express框架的步驟。非常具有實用價值,需要的朋友可以參考下2018-12-12
Node.js入門教程:在windows和Linux上安裝配置Node.js圖文教程
這篇文章主要介紹了Node.js入門教程:在windows和Linux上安裝配置Node.js的方法,本文圖文并茂,步驟明細,是學習安裝node.js的絕佳教程,需要的朋友可以參考下2014-08-08
node.js中的http.response.writeHead方法使用說明
這篇文章主要介紹了node.js中的http.response.writeHead方法使用說明,本文介紹了http.response.writeHead的方法說明、語法、接收參數(shù)、使用實例和實現(xiàn)源碼,需要的朋友可以參考下2014-12-12

