github-oauth-netlify

Netlify Status License GitHub Repo stars

基于 Netlify 云函数的 GitHub OAuth 认证代理。

英文说明/English Documentation

项目结构

1
2
3
4
5
6
github-oauth-netlify/
├── netlify.toml # Netlify 配置
├── package.json
└── netlify/
└── functions/
└── auth.js # OAuth 云函数 (POST /api/auth)

工作原理

云函数只做一件事:接收前端发来的 OAuth 参数,转发给 GitHub 的 token 端点,把结果原样返回。

快速开始

1. 创建 GitHub OAuth App

前往 GitHub Developer Settings → New OAuth App:

字段 值
Application name 任意
Homepage URL 你的站点地址(自定义域名或 *.netlify.app)
Authorization callback URL 前端处理回调的地址

2. 部署到 Netlify

将项目推送到 GitHub,在 Netlify 中关联该仓库即可自动部署。

3. 设置环境变量

在 Netlify 控制台 → Site settings → Environment variables 中无需设置环境变量,因为 client_id、client_secret、code 均由前端在请求体中传入。

4. 前端调用示例

1
2
3
4
5
6
7
8
9
10
11
12
13
// 前端获取到 GitHub 回调的 code 后:
const res = await fetch("https://你的域名.netlify.app/api/auth", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
client_id: "你的 Client ID",
client_secret: "你的 Client Secret",
code: "GitHub 回调的 code",
}),
});

const data = await res.json();
console.log(data.access_token);

本地调试

1
2
3
4
5
# 全局安装 Netlify CLI
npm install -g netlify-cli

# 启动本地开发服务器
npm run dev

npm run dev 等同于执行 netlify dev,云函数将在 http://localhost:8888/api/auth 可用。

License

MIT © huazie

加载评论中...
加载评论中...
加载评论中...
加载评论中...
加载评论中...
加载评论中...