mirror of
https://github.com/Wei-Shaw/claude-relay-service.git
synced 2026-01-22 16:43:35 +00:00
feat: 优化 Gemini OAuth 授权流程，使用固定的 localhost 回调地址
- 将 Gemini OAuth 回调地址固定为 http://localhost:45462 - 更新前端提示文字为"复制oauth后的链接" - 实现自动提取 localhost:45462 链接中的 code 参数功能 - 删除不再需要的 web/auth_gemini 路由 - 添加详细的用户操作说明和错误处理提示 - 支持两种输入方式：完整链接或仅授权码 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
shaw
@@ -406,10 +406,8 @@ router.post('/gemini-accounts/generate-auth-url', authenticateAdmin, async (req,
|
|||||||
try {
|
try {
|
||||||
const { state } = req.body;
|
const { state } = req.body;
|
||||||
|
|
||||||
// 构建 redirect_uri，使用当前服务的地址
|
// 使用固定的 localhost:45462 作为回调地址
|
||||||
const protocol = req.protocol;
|
const redirectUri = 'http://localhost:45462';
|
||||||
const host = req.get('host');
|
|
||||||
const redirectUri = `${protocol}://${host}/web/auth_gemini`;
|
|
||||||
|
|
||||||
logger.info(`Generating Gemini OAuth URL with redirect_uri: ${redirectUri}`);
|
logger.info(`Generating Gemini OAuth URL with redirect_uri: ${redirectUri}`);
|
||||||
|
|
||||||
@@ -420,7 +418,7 @@ router.post('/gemini-accounts/generate-auth-url', authenticateAdmin, async (req,
|
|||||||
await redis.setOAuthSession(sessionId, {
|
await redis.setOAuthSession(sessionId, {
|
||||||
state: authState,
|
state: authState,
|
||||||
type: 'gemini',
|
type: 'gemini',
|
||||||
redirectUri, // 保存 redirect_uri 用于 token 交换
|
redirectUri: redirectUri, // 保存固定的 redirect_uri 用于 token 交换
|
||||||
createdAt: new Date().toISOString()
|
createdAt: new Date().toISOString()
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -470,15 +468,9 @@ router.post('/gemini-accounts/exchange-code', authenticateAdmin, async (req, res
|
|||||||
return res.status(400).json({ error: 'Authorization code is required' });
|
return res.status(400).json({ error: 'Authorization code is required' });
|
||||||
}
|
}
|
||||||
|
|
||||||
// 如果提供了 sessionId，从会话中获取 redirect_uri
|
// 使用固定的 localhost:45462 作为 redirect_uri
|
||||||
let redirectUri = null;
|
const redirectUri = 'http://localhost:45462';
|
||||||
if (sessionId) {
|
logger.info(`Using fixed redirect_uri: ${redirectUri}`);
|
||||||
const oauthSession = await redis.getOAuthSession(sessionId);
|
|
||||||
if (oauthSession && oauthSession.redirectUri) {
|
|
||||||
redirectUri = oauthSession.redirectUri;
|
|
||||||
logger.info(`Using redirect_uri from session: ${redirectUri}`);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const tokens = await geminiAccountService.exchangeCodeForTokens(code, redirectUri);
|
const tokens = await geminiAccountService.exchangeCodeForTokens(code, redirectUri);
|
||||||
|
|
||||||
|
|||||||
@@ -371,174 +371,5 @@ router.get('/style.css', (req, res) => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
// 🔑 Gemini OAuth 回调页面
|
// 🔑 Gemini OAuth 回调页面
|
||||||
router.get('/auth_gemini', (req, res) => {
|
|
||||||
try {
|
|
||||||
const code = req.query.code || '';
|
|
||||||
const state = req.query.state || '';
|
|
||||||
const error = req.query.error || '';
|
|
||||||
const errorDescription = req.query.error_description || '';
|
|
||||||
|
|
||||||
// 简单的 HTML 页面，用于显示授权码
|
|
||||||
const html = `
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="zh-CN">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Gemini 授权回调</title>
|
|
||||||
<style>
|
|
||||||
body {
|
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
background: white;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
|
||||||
padding: 40px;
|
|
||||||
max-width: 600px;
|
|
||||||
width: 90%;
|
|
||||||
}
|
|
||||||
h1 {
|
|
||||||
color: #333;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
.success {
|
|
||||||
color: #22c55e;
|
|
||||||
}
|
|
||||||
.error {
|
|
||||||
color: #ef4444;
|
|
||||||
}
|
|
||||||
.code-box {
|
|
||||||
background: #f3f4f6;
|
|
||||||
border: 1px solid #e5e7eb;
|
|
||||||
border-radius: 6px;
|
|
||||||
padding: 15px;
|
|
||||||
margin: 20px 0;
|
|
||||||
word-break: break-all;
|
|
||||||
font-family: 'Courier New', monospace;
|
|
||||||
font-size: 14px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.copy-button {
|
|
||||||
background: #3b82f6;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
border-radius: 6px;
|
|
||||||
padding: 10px 20px;
|
|
||||||
font-size: 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background 0.2s;
|
|
||||||
}
|
|
||||||
.copy-button:hover {
|
|
||||||
background: #2563eb;
|
|
||||||
}
|
|
||||||
.copy-button:active {
|
|
||||||
background: #1d4ed8;
|
|
||||||
}
|
|
||||||
.instructions {
|
|
||||||
color: #6b7280;
|
|
||||||
margin-top: 20px;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
.step {
|
|
||||||
margin: 10px 0;
|
|
||||||
padding-left: 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
${error ? `
|
|
||||||
<h1 class="error">授权失败</h1>
|
|
||||||
<div class="error">
|
|
||||||
<p><strong>错误：</strong> ${error}</p>
|
|
||||||
${errorDescription ? `<p><strong>描述：</strong> ${errorDescription}</p>` : ''}
|
|
||||||
</div>
|
|
||||||
<div class="instructions">
|
|
||||||
<p>请关闭此页面并返回管理界面重试。</p>
|
|
||||||
</div>
|
|
||||||
` : `
|
|
||||||
<h1 class="success">授权成功</h1>
|
|
||||||
<p>请复制下面的授权码：</p>
|
|
||||||
<div class="code-box" id="codeBox">
|
|
||||||
${code}
|
|
||||||
</div>
|
|
||||||
<button class="copy-button" onclick="copyCode()">复制授权码</button>
|
|
||||||
|
|
||||||
<div class="instructions">
|
|
||||||
<p><strong>接下来的步骤：</strong></p>
|
|
||||||
<div class="step">1. 点击上方按钮复制授权码</div>
|
|
||||||
<div class="step">2. 返回到管理界面的创建账户页面</div>
|
|
||||||
<div class="step">3. 将授权码粘贴到"授权码"输入框中</div>
|
|
||||||
<div class="step">4. 点击"使用授权码创建账户"按钮完成创建</div>
|
|
||||||
</div>
|
|
||||||
`}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
function copyCode() {
|
|
||||||
const code = document.getElementById('codeBox').innerText;
|
|
||||||
navigator.clipboard.writeText(code).then(() => {
|
|
||||||
const button = document.querySelector('.copy-button');
|
|
||||||
const originalText = button.innerText;
|
|
||||||
button.innerText = '已复制！';
|
|
||||||
button.style.background = '#22c55e';
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
button.innerText = originalText;
|
|
||||||
button.style.background = '#3b82f6';
|
|
||||||
}, 2000);
|
|
||||||
}).catch(err => {
|
|
||||||
// 降级方案
|
|
||||||
const selection = window.getSelection();
|
|
||||||
const range = document.createRange();
|
|
||||||
range.selectNodeContents(document.getElementById('codeBox'));
|
|
||||||
selection.removeAllRanges();
|
|
||||||
selection.addRange(range);
|
|
||||||
|
|
||||||
try {
|
|
||||||
document.execCommand('copy');
|
|
||||||
const button = document.querySelector('.copy-button');
|
|
||||||
button.innerText = '已复制！';
|
|
||||||
button.style.background = '#22c55e';
|
|
||||||
} catch (e) {
|
|
||||||
alert('复制失败，请手动选择并复制授权码');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 自动选中授权码文本
|
|
||||||
window.onload = function() {
|
|
||||||
const codeBox = document.getElementById('codeBox');
|
|
||||||
if (codeBox && !${!!error}) {
|
|
||||||
const selection = window.getSelection();
|
|
||||||
const range = document.createRange();
|
|
||||||
range.selectNodeContents(codeBox);
|
|
||||||
selection.removeAllRanges();
|
|
||||||
selection.addRange(range);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
`;
|
|
||||||
|
|
||||||
res.setHeader('Content-Type', 'text/html; charset=utf-8');
|
|
||||||
res.send(html);
|
|
||||||
|
|
||||||
logger.info(`📄 Served Gemini OAuth callback page: ${error ? 'error' : 'success'}`);
|
|
||||||
} catch (error) {
|
|
||||||
logger.error('❌ Error serving Gemini OAuth callback:', error);
|
|
||||||
res.status(500).send('Internal server error');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
module.exports = router;
|
module.exports = router;
|
||||||
@@ -336,6 +336,13 @@ const app = createApp({
|
|||||||
this.loadCurrentTabData();
|
this.loadCurrentTabData();
|
||||||
},
|
},
|
||||||
immediate: false
|
immediate: false
|
||||||
|
},
|
||||||
|
'geminiOauthData.code': {
|
||||||
|
handler(newValue) {
|
||||||
|
if (newValue) {
|
||||||
|
this.handleGeminiAuthCodeInput(newValue);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -1110,6 +1117,47 @@ const app = createApp({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// 处理 Gemini OAuth 授权码输入
|
||||||
|
handleGeminiAuthCodeInput(value, isUserTyping = false) {
|
||||||
|
if (!value || typeof value !== 'string') return;
|
||||||
|
|
||||||
|
const trimmedValue = value.trim();
|
||||||
|
|
||||||
|
// 如果内容为空，不处理
|
||||||
|
if (!trimmedValue) return;
|
||||||
|
|
||||||
|
// 检查是否是 URL 格式（包含 http:// 或 https://）
|
||||||
|
const isUrl = trimmedValue.startsWith('http://') || trimmedValue.startsWith('https://');
|
||||||
|
|
||||||
|
// 如果是 URL 格式
|
||||||
|
if (isUrl) {
|
||||||
|
// 检查是否是正确的 localhost:45462 开头的 URL
|
||||||
|
if (trimmedValue.startsWith('http://localhost:45462')) {
|
||||||
|
try {
|
||||||
|
const url = new URL(trimmedValue);
|
||||||
|
const code = url.searchParams.get('code');
|
||||||
|
|
||||||
|
if (code) {
|
||||||
|
// 成功提取授权码
|
||||||
|
this.geminiOauthData.code = code;
|
||||||
|
this.showToast('成功提取授权码！', 'success', '提取成功');
|
||||||
|
console.log('Successfully extracted authorization code from URL');
|
||||||
|
} else {
|
||||||
|
// URL 中没有 code 参数
|
||||||
|
this.showToast('URL 中未找到授权码参数，请检查链接是否正确', 'error', '提取失败');
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
// URL 解析失败
|
||||||
|
console.error('Failed to parse URL:', error);
|
||||||
|
this.showToast('链接格式错误，请检查是否为完整的 URL', 'error', '解析失败');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 错误的 URL（不是 localhost:45462 开头）
|
||||||
|
this.showToast('请粘贴以 http://localhost:45462 开头的链接', 'error', '链接错误');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 如果不是 URL，保持原值（兼容直接输入授权码）
|
||||||
|
},
|
||||||
|
|
||||||
// 根据当前标签页加载数据
|
// 根据当前标签页加载数据
|
||||||
loadCurrentTabData() {
|
loadCurrentTabData() {
|
||||||
|
|||||||
@@ -2855,10 +2855,15 @@
|
|||||||
<h5 class="font-semibold text-green-900 mb-2">操作说明</h5>
|
<h5 class="font-semibold text-green-900 mb-2">操作说明</h5>
|
||||||
<ol class="text-sm text-green-800 space-y-1 list-decimal list-inside">
|
<ol class="text-sm text-green-800 space-y-1 list-decimal list-inside">
|
||||||
<li>点击下方的授权链接，在新页面中完成Google账号登录</li>
|
<li>点击下方的授权链接，在新页面中完成Google账号登录</li>
|
||||||
<li>查看并授权所请求的权限</li>
|
<li>点击"登录"按钮后可能会加载很慢（这是正常的）</li>
|
||||||
<li>授权完成后，页面会显示授权码</li>
|
<li>如果超过1分钟还在加载，请按 F5 刷新页面</li>
|
||||||
<li>复制授权码并粘贴到下方输入框中</li>
|
<li>授权完成后会跳转到 http://localhost:45462 (可能显示无法访问)</li>
|
||||||
|
<li>复制浏览器地址栏的完整链接并粘贴到下方输入框</li>
|
||||||
</ol>
|
</ol>
|
||||||
|
<div class="mt-3 text-xs text-green-700 bg-green-100 rounded-lg p-3">
|
||||||
|
<i class="fas fa-lightbulb mr-1"></i>
|
||||||
|
<strong>提示：</strong>如果页面一直无法跳转，可以打开浏览器开发者工具（F12），F5刷新一下授权页再点击页面的登录按钮，在"网络"标签中找到以 localhost:45462 开头的请求，复制其完整URL。
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -2891,18 +2896,24 @@
|
|||||||
<!-- 授权码输入框 -->
|
<!-- 授权码输入框 -->
|
||||||
<div>
|
<div>
|
||||||
<label class="block text-sm font-semibold text-gray-700 mb-3">
|
<label class="block text-sm font-semibold text-gray-700 mb-3">
|
||||||
<i class="fas fa-key text-green-500 mr-2"></i>授权码
|
<i class="fas fa-key text-green-500 mr-2"></i>复制oauth后的链接
|
||||||
</label>
|
</label>
|
||||||
<textarea
|
<textarea
|
||||||
v-model="geminiOauthData.code"
|
v-model="geminiOauthData.code"
|
||||||
rows="3"
|
rows="3"
|
||||||
class="form-input w-full resize-none font-mono text-sm"
|
class="form-input w-full resize-none font-mono text-sm"
|
||||||
placeholder="粘贴从授权页面复制的授权码..."
|
placeholder="粘贴以 http://localhost:45462 开头的完整链接..."
|
||||||
></textarea>
|
></textarea>
|
||||||
<p class="text-xs text-gray-500 mt-2">
|
<div class="mt-2 space-y-1">
|
||||||
<i class="fas fa-info-circle mr-1"></i>
|
<p class="text-xs text-gray-600">
|
||||||
授权完成后，从回调页面复制授权码并粘贴到此处
|
<i class="fas fa-check-circle text-green-500 mr-1"></i>
|
||||||
</p>
|
支持粘贴完整链接，系统会自动提取授权码
|
||||||
|
</p>
|
||||||
|
<p class="text-xs text-gray-600">
|
||||||
|
<i class="fas fa-check-circle text-green-500 mr-1"></i>
|
||||||
|
也可以直接粘贴授权码（code参数的值）
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user