ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

Logto Google 连接器实战:OAuth 2.0 社交登录、账户链接与 Google API 授权的完整配置指南

Logto Google 连接器实战:OAuth 2.0 社交登录、账户链接与 Google API 授权的完整配置指南 Logto Google 连接器实战OAuth 2.0 社交登录、账户链接与 Google API 授权的完整配置指南【免费下载链接】logto‍ Authentication and authorization infrastructure for SaaS and AI apps, built on OIDC and OAuth 2.1 with multi-tenancy, SSO, and RBAC.项目地址: https://gitcode.com/GitHub_Trending/lo/logtoLogto 内置的 Google 连接器packages/connectors/connector-google让你的应用获得使用 Google 登录、Google 账户链接/解绑、用户资料同步以及把 Google 访问令牌安全存入 Logto Secret Vault 后调用 Google API 的能力。本文以官方文档 connector-google README 为主线完整覆盖从 Google Cloud 项目创建、OAuth 凭证配置、Scope 策略、Prompts 定制到 Google One Tap 的八个步骤并结合 连接器源码 剖析授权 URI 生成、令牌交换与 ID Token 校验的底层实现。能力总览Google 连接器能做什么根据 官方文档Google 连接器基于 OAuth 2.0 集成使应用可以添加Sign-in with Google使用 Google 登录认证将用户账户与 Google 身份link/unlink链接/解绑从 Google同步用户资料姓名、头像、邮箱等通过 Logto Secret Vault 安全存储的令牌访问 Google API执行自动化任务例如编辑 Docs、管理 Calendar 事件。从源码结构看constant.ts 中isTokenStorageSupported: true声明了该连接器支持令牌持久化存储这是访问 Google API能力的底层开关同时它复用了 connector-kit 中的 GoogleConnector 常量工厂 ID 为google-universal因为 Google One Tap 在多个系统模块中都需要特殊处理。Step 1在 Google Cloud 控制台创建项目使用前必须在 Google Cloud Console 建立项目以获取 OAuth 2.0 凭证已有项目可跳过。登录 Google Cloud Console 后点击顶栏的Select a project再点New Project创建项目进入APIs Services OAuth consent screen配置应用App information填写Application name与Support email会显示在授权同意页上Audience受众类型Internal—— 仅限组织内的 Google Workspace 用户External—— 面向任意 Google 用户生产使用需通过 Google 验证Contact information提供邮箱以便 Google 在项目变更时通知你勾选I agree to Googles policies完成基础设置可选在Branding区域编辑产品信息并上传App logo它会出现在 OAuth 同意页帮助用户识别你的应用。提示若选择External受众开发期间需要添加测试用户生产使用前需要发布应用见 Step 8。Step 2创建 OAuth 2.0 客户端凭证进入 Google Cloud Console 的Credentials页面创建 OAuth 客户端点击Create Credentials OAuth client ID应用类型选择Web application填写Name以便识别凭证该名称不会展示给终端用户配置授权 URI这两项是关键Authorized JavaScript origins添加你的 Logto 实例的源如https://your-logto-domain.com——这一项同时是 Google One Tap 的前置条件见 Step 7Authorized redirect URIs添加 Logto 中 Google 连接器的Callback URI直接从 Logto 连接器详情中复制点击Create生成 OAuth 客户端。Step 3在 Logto 中填入凭证创建完成后Google 会弹出一个包含凭证的对话框复制Client ID粘贴到 Logto 连接器的clientId字段复制Client Secret粘贴到clientSecret字段点击Save and Done完成身份系统与 Google 的对接。从 connector-kit 的配置校验 Schema 看clientId与clientSecret是仅有的两个必填项scope、prompts、oneTap、offlineAccess均为可选// packages/toolkit/connector-kit/src/types/social.tsGoogleConnector.configGuard 摘要 configGuard: z.object({ clientId: z.string(), clientSecret: z.string(), scope: z.string().optional(), prompts: oidcPromptsGuard, oneTap: googleOneTapConfigGuard.optional(), offlineAccess: z.boolean().optional(), })警告妥善保护 client secret切勿暴露在客户端代码中一旦泄露应立即重新生成。Step 4配置 Scopes权限范围Scope 决定了应用向用户申请的权限边界也控制应用能访问其 Google 账户中的哪些数据。配置分两侧Google 控制台侧 Logto 侧。4.1 在 Google Cloud Console 配置 Scope进入APIs Services OAuth consent screen Data Access点击Add or Remove Scopes只勾选应用真正需要的 scope认证类必需https://www.googleapis.com/auth/userinfo.emailhttps://www.googleapis.com/auth/userinfo.profileopenidAPI 访问类可选按需追加Drive、Calendar、YouTube 等。若应用需要基础权限之外的 Google API请先在 Google API Library 中启用对应 API如 Google Drive API、Gmail API、Calendar API点击Update确认选择再点击Save and Continue应用变更。4.2 在 Logto 中配置 Scope三种方案方案适用场景Scope 字段填法方案 1不请求额外 API scope只做社交登录/账户链接留空。Logto 默认请求openid profile email保证能取回基础用户信息方案 2登录时请求额外 scope登录即需要 API 权限用空格分隔填写全部 scope会覆盖默认值因此务必包含三个认证 scopehttps://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile openid且 API scope 使用完整 URL如https://www.googleapis.com/auth/calendar.readonly方案 3后续增量授权权限按需申请Scopes字段留空用户登录后通过 Logto 的 Social Verification API 重新发起联邦社交授权流程更新已存储的令牌集实现增量授权从 源码的授权 URI 生成逻辑 可以印证方案 1/2 的覆盖关系const queryParameters new URLSearchParams({ client_id: clientId, redirect_uri: redirectUri, response_type: code, state, scope: customScope ?? scope ?? defaultScope, // 三级回退请求级 配置级 默认值 ...conditional(prompts prompts.length 0 { prompt: prompts.join( ) }), ...conditional(offlineAccess { access_type: offline }), });其中defaultScope即 constant.ts 中定义的openid profile email——这正是文档所说留空时默认请求基础认证 scope的实现。单测 index.test.ts 也验证了无自定义 scope 时 URL 中出现scopeopenidprofileemail传入自定义 scope 时则完全替换默认值。提示如果应用需要调用 Google API 执行操作请同时启用连接器的Store tokens for persistent API access见 Step 6。Step 5定制认证提示Prompts在 Logto 中配置Prompts它是一个字符串数组用于控制用户交互方式none—— 授权服务器不显示任何认证或同意界面若用户未认证或未预先同意所请求的 scope则直接返回错误。适合静默探测已有认证/同意状态consent—— 返回数据前强制用户确认授权。启用 Google API 离线访问offline access所必需select_account—— 提示用户选择账户多 Google 账户的用户可以挑选用于认证的账户。从 constant.ts 的 formItems 定义 看Prompts 下拉框由OidcPrompt枚举过滤掉login后生成Google 不支持loginprompt且默认值为[select_account]。源码注释明确引用了 Google 官方文档说明该限制。Step 6通用设置以下设置不会阻断与 Google 的连接但会影响终端用户的认证体验。6.1 同步用户资料策略Google 连接器支持两种资料同步策略用户名、头像等Only sync at sign-up仅注册时同步用户首次登录时拉取一次资料Always sync at sign-in每次登录都同步每次登录都更新资料。6.2 存储令牌以访问 Google API可选若要代表用户调用 Google API无论通过社交登录还是账户链接路径需要三步在 Google Cloud Console 的 OAuth consent screen 与 Logto 连接器中分别添加所需 scope在 Logto 连接器中启用Store tokens for persistent API accessLogto 会把 Google 的 access token 与 refresh token 安全存入 Secret Vault为确保 Google 返回 refresh token需Prompts包含consent启用Offline Access。从源码看Offline Access 开关的实际行为就是在授权 URL 上追加access_typeoffline...conditional(offlineAccess { access_type: offline })constant.ts 中该开关的标签为 Refresh access token描述中也注明需要consentprompt。警告不要手动在 Logto 的Scope字段里添加offline_access——可能导致错误。启用离线访问后 Google 会自动通过access_typeoffline处理。Step 7启用 Google One Tap可选Google One Tap 通过弹窗界面让用户用 Google 账户快捷登录。连接器配置完成后连接器详情页会出现 Google One Tap 卡片打开开关即可启用。配置项包括Auto-select credential if possible—— 满足条件时自动用 Google 账户完成登录Cancel the prompt if user clicks/taps outside—— 点击/触摸弹窗外区域即关闭禁用则必须点关闭按钮Enable Upgraded One Tap UX on ITP browsers—— 在 Intelligent Tracking PreventionITP浏览器上启用升级后的 One Tap 体验。这些选项对应 connector-kit 中的 GoogleOneTapConfig 类型export type GoogleOneTapConfig { isEnabled?: boolean; autoSelect?: boolean; closeOnTapOutside?: boolean; itpSupport?: boolean; };警告务必把你的域名加入 OAuth 客户端的Authorized JavaScript origins否则 Google One Tap 无法显示。One Tap 的令牌限制与增量授权启用Store tokens for persistent API access与Google One Tap同时使用时不会自动获得 access token 或所请求的 scope。原因在源码中清晰可见getUserInfoJsonAndTokenResponse 检测到数据符合googleOneTapDataGuard即只携带credential字段时仅对 ID TokenJWT做签名校验并返回rawUserInfo不返回 tokenResponse——因为 One Tap 只签发 ID Token 证明身份不签发 OAuth access token。此时的标准做法用户用 One Tap 登录后通过 Logto 的 Social Verification API 重新发起联邦社交授权流程按需申请额外 scope 并更新用户的令牌集。这样既不需要在连接器Scopes字段预填 scope也实现了增量授权——用户只在应用真正需要时才被提示额外授权。Step 8测试与发布应用Internal 应用Audience Internal仅组织内 Google Workspace 用户可用直接用组织内任意账户测试即可External 应用Audience External开发阶段进入OAuth consent screen Test users添加测试用户邮箱只有这些用户能登录生产阶段在 OAuth consent screen 区域点击Publish App使任何拥有 Google 账户的用户都能使用。注意使用敏感或受限 scope 的应用可能需要先通过 Google 验证才能发布该过程可能耗时数周。底层实现解析连接器如何与 Google 通信从 src/index.ts 的完整实现看整个认证链路由三个端点支撑定义于 constant.ts端点常量用途https://accounts.google.com/o/oauth2/v2/authauthorizationEndpoint生成授权跳转 URLhttps://oauth2.googleapis.com/tokenaccessTokenEndpoint用授权码交换令牌https://openidconnect.googleapis.com/v1/userinfouserInfoEndpoint用 access token 拉取用户信息https://www.googleapis.com/oauth2/v3/certsjwksUriOne Tap ID Token 验签用的 JWKS关键实现细节Code 交换getAccessToken以表单方式 POST 到令牌端点其中对code做了decodeURIComponent处理源码注释指出这是规避 Google 返回 invalid_grant/malformed auth code 的已知问题并用 types.ts 中的 accessTokenResponseGuard 校验响应结构access_token、scope、token_type必填refresh_token可选。若返回空access_token抛出SocialAuthCodeInvalid错误用户信息解析parseUserInfoResponse将 Google 的sub/name/picture/email/email_verified映射为 Logto 的SocialUserInfo且email仅在email_verified为真时才返回——即未验证邮箱不会同步进 LogtoOne Tap 验签使用jose库的createRemoteJWKSetjwtVerify校验 ID Tokenissuer 限定为https://accounts.google.com或accounts.google.comaudience 为配置的clientId时钟容差 10 秒错误处理getUserInfoErrorHandler把 HTTP 401 归一化为SocialAccessTokenInvalid其余 HTTP 错误携带原始响应体抛出General错误。单测 用 nock 分别覆盖了令牌交换、401、通用错误、One Tap 凭证解码等路径刷新令牌getAccessTokenByRefreshToken复用 connector-kit 的通用实现向accessTokenEndpoint发起 refresh_token 授权类型请求——这是存储令牌 离线访问能力在运行期的续期入口。落地使用把 Google 连接器接入终端用户流程创建并连好 Google 连接器后可按需启用以下场景启用 Sign-in with Google进入 Logto Console 的Sign-in experience Sign-up and sign-in页面在Social sign-in区域添加 Google 连接器可选在登录/注册页同时启用Google One Tap获得更流畅的认证体验。链接或解绑 Google 账户使用 Account API 构建自定义 Account Center让已登录用户自行 link/unlink Google 账户。文档同时指出可以只启用 Google 连接器做账户链接和 API 访问而不启用社交登录。调用 Google API 执行操作应用可从 Secret Vault 取出存储的 Google access token 调用 Google API实现后端自动化任务管理 Drive 文件、创建 Calendar 事件、通过 Gmail 发信等。管理用户的 Google 身份用户链接 Google 账户后管理员可在 Logto Console 中管理该连接进入User management并打开用户资料页在Social connections下找到 Google 项点击Manage在该页面管理员可管理用户的 Google 连接、查看用户授予并从 Google 同步的全部资料信息、检查 access token 的存储状态。参考connector-google 官方文档连接器实现端点与默认配置响应结构校验Zod SchemaGoogleConnector 常量与配置类型单元测试包定义logto/connector-googleNode^22.14.0依赖logto/connector-kit、got、jose、zod以上配置以当前仓库中连接器 README 与源码为准Google Cloud 控制台界面与 Google 官方策略如 External 应用的验证流程、受限 scope 的发布要求可能随 Google 侧更新而变化实操时请以 Google 控制台实际显示为准。【免费下载链接】logto‍ Authentication and authorization infrastructure for SaaS and AI apps, built on OIDC and OAuth 2.1 with multi-tenancy, SSO, and RBAC.项目地址: https://gitcode.com/GitHub_Trending/lo/logto创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表