Flask应用集成Google SSO遇问题：按钮异常及登录报错求助

已遇问题回顾 #

• 用127.0.0.1运行Flask应用时，Google SSO按钮不显示，切换到localhost:3000后按钮正常显示
• 点击登录时触发GSI_LOGGER错误：login_uri is not allowed for the given client ID，本地无法运行HTTPS服务器，且按官方文档localhost应豁免HTTPS要求

核心排查与修复步骤 #

1. 核对Google Cloud控制台的URI配置 #

确保授权重定向URI和授权JavaScript来源完全匹配本地环境：

• 授权JavaScript来源：添加http://localhost:3000（使用HTTP协议，而非HTTPS）
• 授权重定向URI：添加http://localhost:3000/login（需和代码中data-login_uri完全一致）

注意：Google控制台的URI配置严格区分协议、端口号，修改后需等待5-10分钟让设置生效

2. 修正前端代码的data-login_uri协议 #

将代码中HTTPS协议改为HTTP：

<div id="g_id_onload"
     data-client_id="{{google_client_id}}"
     data-ux_mode="redirect"
     data-login_uri="http://localhost:3000/login"
     >
</div>

本地localhost环境无需HTTPS，强制使用HTTPS会触发URI不允许的错误。

3. 固定Flask应用的运行地址 #

启动Flask时明确绑定localhost:3000，避免自动使用127.0.0.1：

if __name__ == '__main__':
    app.run(host='localhost', port=3000, debug=True)

4. 清除浏览器缓存与Cookie #

浏览器可能缓存了旧的身份验证配置，清除后重新测试：

• 清除当前站点的Cookie
• 强制刷新页面（Ctrl+F5）

额外注意事项 #

• 确认在Google Cloud控制台中修改的是目标OAuth 2.0客户端ID，不要选错项目或客户端
• 使用ux_mode="redirect"时，重定向URI必须在控制台中明确配置，不能省略端口号

内容的提问来源于stack exchange，提问作者Manan