在 Node.js 中实现 GitHub 登录功能,通常需要使用 OAuth 2.0 协议。GitHub 提供了 OAuth 认证机制,用户可以通过 GitHub 登录授权应用访问其数据。以下是实现 GitHub 登录的步骤。
我们将使用 passport 中间件和 passport-github2 策略来简化 OAuth 认证流程。
1. 安装所需的 npm 包
首先,创建一个新的 Node.js 项目并安装必需的依赖:
csharp
bash
复制编辑
npm init -y
npm install express passport passport-github2 express-session dotenv
express: 用于构建 web 应用。passport: 用于认证的中间件。passport-github2: GitHub 的 OAuth 认证策略。express-session: 用于管理会话。dotenv: 用于管理环境变量。
2. 配置 GitHub OAuth 应用
在 GitHub 上创建 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 文件
在项目根目录下创建一个 .env 文件,存储 GitHub 的 Client ID 和 Client Secret。
ini
env
复制编辑
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. 创建 app.js 文件并实现 OAuth 登录
创建 app.js 文件并编写以下代码:
javascript
javascript
复制编辑
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">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:此路由用于触发 GitHub 登录流程,用户点击链接后,会被重定向到 GitHub 登录页面。/auth/github/callback:GitHub 会回调此路由,将认证信息传递给应用。如果认证成功,用户信息将会存储在req.user中,并跳转到/profile页面。/profile:如果用户已经登录,将显示用户的 GitHub 个人资料。/logout:用于用户退出登录。passport.serializeUser和passport.deserializeUser:这两个方法将用户信息存储到会话中。
5. 启动应用并测试
-
启动 Node.js 应用:
bash 复制编辑 node app.js -
打开浏览器,访问
http://localhost:3000。 -
点击 Login with GitHub,GitHub 将提示你授权应用。
-
完成授权后,你将被重定向到
/profile页面,显示你的 GitHub 用户信息。
6. 处理认证失败和错误(可选)
你可能需要在认证失败时提供合适的反馈,可以在 passport.authenticate 中设置 failureRedirect:
javascript
javascript
复制编辑
app.get('/auth/github/callback', (req, res) => {
passport.authenticate('github', { failureRedirect: '/' })(req, res, function() {
res.redirect('/profile');
});
});
如果认证失败,用户将被重定向到首页。
7. 保护路由(可选)
你可以通过 req.isAuthenticated() 来检查用户是否已认证,如果没有认证,则重定向到登录页面。
javascript
javascript
复制编辑
app.get('/profile', (req, res) => {
if (!req.isAuthenticated()) {
return res.redirect('/');
}
res.json(req.user); // 返回用户信息
});
总结
通过上述步骤,你已经成功地在 Node.js 中实现了 GitHub 登录。使用 Passport 和 passport-github2 策略简化了 OAuth 认证流程。你可以根据需要扩展功能,比如存储用户数据、处理登录状态等。