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
2025-07-22 11:42:54 +08:00
parent ed99043127
commit 11318c22b0
4 changed files with 74 additions and 192 deletions

View File

@@ -336,6 +336,13 @@ const app = createApp({
this.loadCurrentTabData();
},
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() {

View File

@@ -2855,10 +2855,15 @@
<h5 class="font-semibold text-green-900 mb-2">操作说明</h5>
<ol class="text-sm text-green-800 space-y-1 list-decimal list-inside">
<li>点击下方的授权链接在新页面中完成Google账号登录</li>
<li>查看并授权所请求的权限</li>
<li>授权完成后,页面会显示授权码</li>
<li>复制授权码并粘贴到下方输入框中</li>
<li>点击"登录"按钮后可能会加载很慢(这是正常的)</li>
<li>如果超过1分钟还在加载请按 F5 刷新页面</li>
<li>授权完成后会跳转到 http://localhost:45462 (可能显示无法访问)</li>
<li>复制浏览器地址栏的完整链接并粘贴到下方输入框</li>
</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>如果页面一直无法跳转可以打开浏览器开发者工具F12F5刷新一下授权页再点击页面的登录按钮在"网络"标签中找到以 localhost:45462 开头的请求复制其完整URL。
</div>
</div>
</div>
</div>
@@ -2891,18 +2896,24 @@
<!-- 授权码输入框 -->
<div>
<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>
<textarea
v-model="geminiOauthData.code"
rows="3"
class="form-input w-full resize-none font-mono text-sm"
placeholder="粘贴从授权页面复制的授权码..."
placeholder="粘贴以 http://localhost:45462 开头的完整链接..."
></textarea>
<p class="text-xs text-gray-500 mt-2">
<i class="fas fa-info-circle mr-1"></i>
授权完成后,从回调页面复制授权码并粘贴到此处
</p>
<div class="mt-2 space-y-1">
<p class="text-xs text-gray-600">
<i class="fas fa-check-circle text-green-500 mr-1"></i>
支持粘贴完整链接,系统会自动提取授权码
</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>