使用Node.js實現GitHub登錄功能
在 Node.js 中實現 GitHub 登錄功能，通常需要使用 OAuth 2.0 協(xié)議。GitHub 提供了 OAuth 認證機制，用戶可以通過 GitHub 登錄授權應用訪問其數據。以下是實現 GitHub 登錄的步驟。
我們將使用 passport 中間件和 passport-github2 策略來簡化 OAuth 認證流程。
1. 安裝所需的 npm 包
首先，創(chuàng)建一個新的 Node.js 項目并安裝必需的依賴：
npm init -y npm install express passport passport-github2 express-session dotenv
express: 用于構建 web 應用。passport: 用于認證的中間件。passport-github2: GitHub 的 OAuth 認證策略。express-session: 用于管理會話。dotenv: 用于管理環(huán)境變量。
2. 配置 GitHub OAuth 應用
在 GitHub 上創(chuàng)建 OAuth 應用并獲取 Client ID 和 Client Secret，步驟如下：
點擊 "New OAuth App" 按鈕。
填寫以下信息：
- Application Name：應用名稱（例如："MyApp"）。
- Homepage URL：應用主頁的 URL（例如：
http://localhost:3000）。 - Authorization callback URL：回調 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 文件并實現 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;
// 設置會話中間件
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 用戶信息存儲到數據庫
return done(null, profile);
}));
// 序列化用戶到 session 中
passport.serializeUser(function(user, done) {
done(null, user);
});
// 反序列化用戶
passport.deserializeUser(function(user, done) {
done(null, user);
});
// 路由：跳轉到 GitHub 登錄頁面
app.get('/auth/github', (req, res) => {
passport.authenticate('github', { scope: ['user:email'] })(req, res);
});
// 路由：GitHub 登錄回調
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>');
});
// 啟動服務器
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 會回調此路由，將認證信息傳遞給應用。如果認證成功，用戶信息將會存儲在req.user中，并跳轉到/profile頁面。/profile：如果用戶已經登錄，將顯示用戶的 GitHub 個人資料。/logout：用于用戶退出登錄。passport.serializeUser和passport.deserializeUser：這兩個方法將用戶信息存儲到會話中。
5. 啟動應用并測試
啟動 Node.js 應用：
node app.js
打開瀏覽器，訪問 http://localhost:3000。
點擊 Login with GitHub，GitHub 將提示你授權應用。
完成授權后，你將被重定向到 /profile 頁面，顯示你的 GitHub 用戶信息。
6. 處理認證失敗和錯誤（可選）
你可能需要在認證失敗時提供合適的反饋，可以在 passport.authenticate 中設置 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); // 返回用戶信息
});
總結
通過上述步驟，你已經成功地在 Node.js 中實現了 GitHub 登錄。使用 Passport 和 passport-github2 策略簡化了 OAuth 認證流程。你可以根據需要擴展功能，比如存儲用戶數據、處理登錄狀態(tài)等。
到此這篇關于使用Node.js實現GitHub登錄功能的文章就介紹到這了,更多相關Node.js GitHub登錄內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
Restify中接入Socket.io報Error:Can’t set headers的錯誤解決
這篇文章主要給大家介紹了在Restify中接入Socket.io報Error:Can’t set headers的錯誤解決方法，文中介紹的非常詳細，對大家具有一定的參考價值，需要的朋友們下面來一起看看吧。2017-03-03
本文主要詳細介紹了node包管理工具，主要介紹了npm，cnpm及yarn，文中有詳細的代碼示例，對學習具有一定參考價值，需要的朋友可以參考一下2023-04-04
cheerio類似于jQuery的API,讓我們可以方便地操作HTML文檔,下面我們就來看看在Node.js中如何借助cheerio庫高效地解析和提取HTML內容吧2024-11-11
node.js中fs文件系統(tǒng)模塊的使用方法實例詳解
這篇文章主要介紹了node.js中fs文件系統(tǒng)模塊的使用方法,結合實例形式詳細分析了node.js fs文件系統(tǒng)模塊各種常見方法的基本使用技巧與相關操作注意事項,需要的朋友可以參考下2020-02-02
Express是一個基于Node.js平臺的輕量級Web應用框架,它提供了簡潔的API和豐富的功能,本文主要介紹了Express框架搭建項目的實現步驟,感興趣的可以了解一下2024-06-06
現今，網頁抓取已經是一種人所共知的技術了，然而依然存在著諸多復雜性，下面這篇文章主要給大家介紹了Node.JS利用PhantomJs抓取網頁的方法教程，需要的朋友可以參考借鑒，下面來一起看看吧。2017-05-05
這篇文章主要介紹了nodejs結合Socket.IO實現的即時通訊功能,結合實例形式詳細分析了nodejs結合Socket.IO實現即時通訊的相關操作技巧與注意事項,需要的朋友可以參考下2018-01-01
如何刪除所有node_modules和package-lock配置文件
這篇文章主要介紹了如何刪除所有node_modules和package-lock配置文件問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-02-02
nodejs創(chuàng)建簡易web服務器與文件讀寫的實例
下面小編就為大家?guī)硪黄猲ode js系列課程-創(chuàng)建簡易web服務器與文件讀寫的實例。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
Node.js是一個事件驅動I/O服務端JavaScript環(huán)境,由于其擁有異步非阻塞、環(huán)境搭建簡單、實踐應用快等特性,使得其在新一代編程開發(fā)中更為流行,下面這篇文章主要給大家介紹了關于Node.Js環(huán)境搭建步驟記錄的相關資料,需要的朋友可以參考下2023-03-03