Google OAuth 设置笔记

15 min read

Google OAuth 设置笔记

配置项说明

  1. Authorized JavaScript Origins

    • 用途：指定允许通过 JavaScript 发起请求的来源。
    • 格式：完整的 URL，不包含路径或通配符。
    • 示例：http://localhost:3000
    • 说明：仅在应用需要通过 JavaScript 发起跨域请求时才必要。

  2. Authorized Redirect URIs

    • 用途：指定 OAuth 认证流程中授权服务器重定向的 URI。

    • 格式：完整的 URL，可以包含路径。

    • 示例：http://localhost:3000/api/auth/callback/google

    • 说明：这是 OAuth 认证流程的关键配置，确保认证后正确重定向。

在一些情况下，即使没有配置 "Authorized JavaScript Origins"，Google 登录也能正常工作。这种现象可能有以下几个原因：

  1. 开发环境的宽松限制：

    • 在开发环境中，某些浏览器和开发服务器可能会放宽 CORS 限制，允许从 localhost 发起的请求，即使这些请求没有在 "Authorized JavaScript Origins" 中明确列出。

  2. 默认安全策略：

    • Google 可能对 localhost 和 127.0.0.1 等常见的本地开发地址默认放宽了安全策略，以便于开发者调试和测试。

  3. 浏览器缓存和会话：

    • 如果你曾经配置过正确的 "Authorized JavaScript Origins"，并且浏览器缓存了会话信息，可能会暂时允许请求通过，即使你后来移除了配置。

  4. 误配置或未及时生效：

    • 可能你在 Google Cloud Console 中的配置更新需要一定时间才能生效，或是浏览器还没有刷新最新的配置。

建议

尽管在开发环境中可能没有问题，但在生产环境中，确保正确配置 "Authorized JavaScript Origins" 以避免潜在的问题和安全隐患。

配置步骤

  1. 登录 Google Cloud Console：访问 Google Cloud Console。
  2. 选择项目：选择你要配置的项目或创建一个新项目。
  3. 导航到 OAuth 同意屏幕：在导航菜单中，转到 "API 和服务" -> "OAuth 同意屏幕"，配置应用名称和其他必需信息。
  4. 创建 OAuth 2.0 凭据：导航到 "API 和服务" -> "凭据"，点击 "创建凭据" 并选择 "OAuth 客户端 ID"。
  5. 配置 Authorized JavaScript Origins：在 "Authorized JavaScript Origins" 中添加 http://localhost:3000 及其他你需要的来源。
  6. 配置 Authorized Redirect URIs：在 "Authorized Redirect URIs" 中添加 http://localhost:3000/auth/callback 及其他你需要的重定向 URI。

示例

配置 "Authorized JavaScript Origins" 和 "Authorized Redirect URIs"

  • Authorized JavaScript Origins：

    • http://localhost:3000
    • https://www.yourdomain.com

  • Authorized Redirect URIs：

    • http://localhost:3000/api/auth/callback/google
    • https://www.yourdomain.com/api/auth/callback/google