↑

CloudBase Web 认证集成v1.0.0

cloudbase-references-auth-web4 KB

为已配置好 auth-tool 的 CloudBase 项目,提供 Web 前端登录、注册、会话管理与用户资料操作的完整代码方案。覆盖手机号/邮箱验证码、密码、匿名、OAuth、自定义票据等 8 种登录方式,以及登出、换绑、注销、状态监听等用户生命周期管理。

0 0 0 0 更新于 2026-10-28 18:24

免责声明:本站部分 Skill 来源于公开渠道,使用前请注意识别相关风险,内容版权归原作者所有,如 Skill 涉及版权问题,请在线反馈,核实后予以下架处理。

概述

本 Skill 面向使用 @cloudbase/js-sdk 构建 Web 前端认证流程的开发者,在 auth-tool 已完成登录方式开关和 publishable key 配置的前提下,直接输出可运行的前端集成代码。覆盖从初始化 SDK、多种登录注册方式(手机/邮箱验证码、密码、匿名、OAuth、自定义票据)、会话持久化,到用户信息修改、密码重置、第三方账号绑定与解绑、账号注销等完整用户生命周期操作。所有代码片段均标注参数映射陷阱(如 phone 非 phone_number、token 为验证码字段),并给出与现有 UI 表单处理器接线的具体示例,避免产生"写了 helper 文件但按钮点击无响应"的悬空代码。

技能包含

  • SKILL.md(本文件):技能主说明,包含触发条件、8 种登录方式的完整代码示例、用户管理 API 速查、参数映射表与常见错误规避

核心能力

  • 多方式登录注册:手机/邮箱 OTP、用户名/邮箱/手机+密码、匿名登录、Google/微信 OAuth、自定义票据登录,以及匿名账号升级绑定
  • 会话与状态管理:自动 URL 会话检测、登录态变化监听(INITIAL_SESSION/SIGNED_IN/SIGNED_OUT/TOKEN_REFRESHED 等)、access_token 获取与刷新
  • 用户信息维护:资料修改(昵称/头像/性别等)、邮箱/手机换绑(需 OTP 二次确认)、密码修改与遗忘重置
  • 身份源操作:查询已绑定身份源、关联新第三方账号、解绑已有身份源
  • 安全注销:支持密码校验的账号彻底删除

应用场景

用户怎么说本技能做什么
"我要在现有 React/Vue 项目里接入 CloudBase 手机号验证码登录"提供 auth.signInWithOtp({ phone }) + verifyOtp({ token }) 的完整调用链,并示范如何将 sendCode / verifyCode 接入现有表单 handler,而非注释掉的死代码
"用户登录后怎么拿到 token 传给后端鉴权"给出 auth.getSession() 获取 access_token 并写入 Authorization: Bearer 请求头的标准写法
"需要支持微信扫码和邮箱两种登录,还要能换绑手机"分别输出 OAuth 跳转登录、邮箱 OTP 登录代码,以及 updateUser({ phone }) + verifyOtp 的换绑流程,并提示需先在 auth-tool 开启对应开关
"匿名游客后面要转正成正式账号"提供 signInAnonymously() 获取匿名会话,再调用 signUp 传入 anonymous_token 完成升级的完整代码
"怎么监听用户登出事件做路由跳转"给出 auth.onAuthStateChange 监听 SIGNED_OUT 事件并执行页面重定向的示例