使用Node.js实现GitHub登录功能

在 Node.js 中实现 GitHub 登录功能,通常需要使用 OAuth 2.0 协议。GitHub 提供了 OAuth 认证机制,用户可以通过 GitHub 登录授权应用访问其数据。以下是实现 GitHub 登录的步骤。

我们将使用 passport 中间件和 passport-github2 策略来简化 OAuth 认证流程。

1. 安装所需的 npm 包

首先,创建一个新的 Node.js 项目并安装必需的依赖:

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 IDClient Secret,步骤如下:

  • 访问 GitHub OAuth Applications。

  • 点击 “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 IDClient Secret,这些需要在代码中使用。

3. 配置 .env 文件

在项目根目录下创建一个 .env 文件,存储 GitHub 的 Client IDClient 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. 创建 app.js 文件并实现 OAuth 登录

创建 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 IDClient Secret 进行认证。
  • /auth/github:此路由用于触发 GitHub 登录流程,用户点击链接后,会被重定向到 GitHub 登录页面。
  • /auth/github/callback:GitHub 会回调此路由,将认证信息传递给应用。如果认证成功,用户信息将会存储在 req.user 中,并跳转到 /profile 页面。
  • /profile:如果用户已经登录,将显示用户的 GitHub 个人资料。
  • /logout:用于用户退出登录。
  • passport.serializeUserpassport.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 登录。使用 Passportpassport-github2 策略简化了 OAuth 认证流程。你可以根据需要扩展功能,比如存储用户数据、处理登录状态等。

到此这篇关于使用Node.js实现GitHub登录功能的文章就介绍到这了,更多相关Node.js GitHub登录内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

来源链接:https://www.jb51.net/javascript/339800uv6.htm

© 版权声明
THE END
支持一下吧
点赞7 分享
03d74d1f97584b6b的头像-牛翰网
评论 抢沙发
头像
请文明发言!
提交
头像

昵称

取消
昵称表情代码快捷回复

    暂无评论内容