@cloudbase/oauth 3.0.0 → 3.0.1

package/src/auth/apis.ts

@@ -1,6 +1,6 @@
 'use strict'
 
-import { ApiUrls, ApiUrlsV2, ErrorType } from './consts'
+import { ApiUrls, ApiUrlsV2, AUTH_STATE_CHANGED_TYPE, ErrorType, EVENTS, OAUTH_TYPE } from './consts'
 import {
   GetVerificationRequest,
   GetVerificationResponse,
@@ -56,7 +56,7 @@ import {
   GetUserBehaviorLog,
   GetUserBehaviorLogRes,
   RevokeDeviceRequest,
-  SignoutReponse,
+  SignoutResponse,
   ProvidersResponse,
   SignoutRequest,
   ModifyPasswordWithoutLoginRequest,
@@ -69,9 +69,10 @@ import { deepClone } from '../utils'
 import MyURLSearchParams from '../utils/urlSearchParams'
 import { SDKAdapterInterface } from '@cloudbase/adapter-interface'
 import { ICloudbaseConfig } from '@cloudbase/types'
+import { AuthError } from './auth-error'
 
-function getEncryptUtils(isEncrypt, adapter: SDKAdapterInterface) {
-  const getUtils = () => {
+async function getEncryptUtils(isEncrypt, adapter: SDKAdapterInterface) {
+  const getUtils = async () => {
     try {
       /* eslint-disable */
       // @ts-ignore
@@ -79,7 +80,13 @@ function getEncryptUtils(isEncrypt, adapter: SDKAdapterInterface) {
       /* eslint-enable */
       return utils
     } catch (error) {
-      return
+      try {
+        // @ts-ignore
+        const utils = await import('../utils/encrypt')
+        return utils
+      } catch (error) {
+        return
+      }
     }
   }
 
@@ -118,7 +125,17 @@ export interface AuthOptions {
   onCredentialsError?: (data: { msg: string; eventType?: 'credentials_error' }) => void
   headers?: { [key: string]: string }
   i18n?: ICloudbaseConfig['i18n']
-  publishable_key?: string
+  useWxCloud?: boolean
+  eventBus?: any
+  /**
+   * Set to true if you want to automatically detect OAuth grants in the URL
+   * and exchange the code for credentials.
+   */
+  detectSessionInUrl?: boolean
+  /**
+   * Enable debug logging
+   */
+  debug?: boolean
 }
 
 /**
@@ -158,17 +175,19 @@ export class Auth {
         onCredentialsError: opts.onCredentialsError,
         headers: opts.headers || {},
         i18n: opts.i18n,
-        publishable_key: opts.publishable_key,
+        debug: opts.debug,
       }
       oAuth2Client = new OAuth2Client(initOptions)
     }
     if (!request) {
       const baseRequest = oAuth2Client.request.bind(oAuth2Client)
       const captcha = new Captcha({
+        env: opts.env,
         clientId: opts.clientId,
         request: baseRequest,
         storage: opts.storage,
         adapter: opts.adapter,
+        oauthInstance: this,
         ...opts.captchaOptions,
       })
       request = captcha.request.bind(captcha)
@@ -263,11 +282,11 @@ export class Auth {
    * Sign out.
    * @return {Object} A Promise<SignoutRequest> object.
    */
-  public async signOut(params?: SignoutRequest): Promise<SignoutReponse> {
-    let resp: SignoutReponse = {}
+  public async signOut(params?: SignoutRequest): Promise<SignoutResponse> {
+    let resp: SignoutResponse = {}
     if (params) {
       try {
-        resp = await this.config.request<SignoutReponse>(ApiUrls.AUTH_SIGNOUT_URL, {
+        resp = await this.config.request<SignoutResponse>(ApiUrls.AUTH_SIGNOUT_URL, {
           method: 'POST',
           withCredentials: true,
           body: params,
@@ -332,9 +351,16 @@ export class Auth {
         withCredentials = true
       }
     }
+
+    const body = deepClone(params)
+
+    if (body.phone_number && !/^\+\d{1,3}\s+\d+/.test(body.phone_number)) {
+      body.phone_number = `+86 ${body.phone_number}`
+    }
+
     return this.config.request<GetVerificationResponse>(ApiUrls.VERIFICATION_URL, {
       method: 'POST',
-      body: params,
+      body,
       withCaptcha: options?.withCaptcha || false,
       withCredentials,
     })
@@ -368,6 +394,7 @@ export class Auth {
    * @return {Promise<GenProviderRedirectUriResponse>} A Promise<GenProviderRedirectUriResponse> object.
    */
   public async genProviderRedirectUri(params: GenProviderRedirectUriRequest): Promise<GenProviderRedirectUriResponse> {
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     const { provider_redirect_uri: redirect_uri, other_params: otherParams = {}, ...restParams } = params
     if (redirect_uri && !restParams.redirect_uri) {
       restParams.redirect_uri = redirect_uri
@@ -436,6 +463,154 @@ export class Auth {
     return Promise.resolve(credentials)
   }
 
+  public async toBindIdentity(params: {
+    provider_token: string
+    provider: string
+    credentials?: Credentials
+    fireEvent?: boolean
+  }) {
+    const credentials = params.credentials || (await this.config.credentialsClient.localCredentials.getCredentials())
+    let res: any
+    try {
+      await this.bindWithProvider(
+        {
+          provider_token: params.provider_token,
+        },
+        credentials,
+      )
+      res = { data: { type: OAUTH_TYPE.BIND_IDENTITY, provider: params.provider }, error: null }
+    } catch (error) {
+      res = { data: { type: OAUTH_TYPE.BIND_IDENTITY }, error: new AuthError(error) }
+    }
+
+    if (params.fireEvent) {
+      this.config.eventBus?.fire?.(EVENTS.AUTH_STATE_CHANGED, {
+        event: AUTH_STATE_CHANGED_TYPE.BIND_IDENTITY,
+        info: res,
+      })
+    }
+
+    return res
+  }
+
+  /**
+   * 获取初始 session（如从 URL 中的 OAuth 回调）。
+   * 用于 OAuth2Client.initialize() 回调。
+   * 内部处理 URL 检测、OAuth 验证，返回 credentials 和 user。
+   * 不调用 setCredentials，由 OAuth2Client 负责保存。
+   *
+   * @returns { data: { session: Credentials; user?: any } | null, error: Error | null }
+   */
+  public async getInitialSession(): Promise<{
+    data: { session: Credentials; user?: any } | null
+    error: Error | null
+  }> {
+    let data: any = {}
+    try {
+      // Check if running in browser
+      if (typeof window === 'undefined' || typeof document === 'undefined') {
+        return { data: null, error: null }
+      }
+
+      // Parse URL parameters
+      const localSearch = new URLSearchParams(location?.search)
+      const code = localSearch.get('code')
+      const state = localSearch.get('state')
+
+      // No OAuth callback detected
+      if (!code || !state) {
+        return { data: null, error: null }
+      }
+
+      // Get provider from sessionStorage (saved during signInWithOAuth)
+      let cacheData: {
+        provider?: string
+        search?: string
+        hash?: string
+        type?: (typeof OAUTH_TYPE)[keyof typeof OAUTH_TYPE]
+      } | null = null
+      try {
+        cacheData = JSON.parse(sessionStorage.getItem(state) || 'null')
+      } catch {
+        // ignore
+      }
+      data = { type: cacheData?.type }
+      // Check for error in URL
+      const errorParam = localSearch.get('error')
+      const errorDescription = localSearch.get('error_description')
+      if (errorParam || errorDescription) {
+        return {
+          data,
+          error: new AuthError({ message: errorDescription || errorParam || 'Unknown error from OAuth provider' }),
+        }
+      }
+
+      const provider = cacheData?.provider || localSearch.get('provider')
+
+      if (!provider) {
+        return { data, error: new AuthError({ message: 'Provider is required for OAuth verification' }) }
+      }
+
+      // 获取当前页面的 redirect_uri
+      const redirectUri = location.origin + location.pathname
+
+      // Step 1: 获取 provider token
+      const { provider_token: providerToken } = await this.grantProviderToken({
+        provider_id: provider,
+        provider_redirect_uri: redirectUri,
+        provider_code: code,
+      })
+
+      let credentials: Credentials
+      let user: any = null
+      let res: any
+
+      if (cacheData.type === OAUTH_TYPE.BIND_IDENTITY) {
+        credentials = await this.config.credentialsClient.localCredentials.getCredentials()
+        res = await this.toBindIdentity({ provider, provider_token: providerToken, credentials })
+      } else if (cacheData.type === OAUTH_TYPE.SIGN_IN) {
+        res = this.getParamsByVersion({ provider }, 'AUTH_SIGN_IN_WITH_PROVIDER_URL')
+
+        // Step 2: 用 provider token 换取 credentials（直接调用 API，不触发 setCredentials）
+        credentials = await this.config.request<Credentials>(res.url, {
+          method: 'POST',
+          body: { provider_token: providerToken },
+        })
+
+        // Step 3: 获取 user info，传入 getCredentials 函数避免死锁
+        // 不调用 setCredentials，由 OAuth2Client._initialize 负责保存
+        try {
+          user = await this.getUserInfo({ credentials })
+        } catch (e) {
+          console.error('get user info error', e)
+          // 获取 user 失败不影响登录流程
+        }
+
+        res = { data: { ...data, session: credentials, user }, error: null }
+      }
+
+      // Clean up URL parameters and restore original URL state
+      localSearch.delete('code')
+      localSearch.delete('state')
+      localSearch.delete('provider')
+      this.restoreUrlState(
+        cacheData?.search === undefined ? `?${localSearch.toString()}` : cacheData.search,
+        cacheData?.hash || location.hash,
+      )
+
+      // Remove session storage
+      try {
+        sessionStorage.removeItem(state)
+      } catch {
+        // ignore
+      }
+
+      return res
+    } catch (error) {
+      return { data, error: new AuthError(error) }
+    }
+  }
+
   /**
    * Signin with custom.
    * @param {SignInCustomRequest} params A SignInCustomRequest object.
@@ -469,11 +644,12 @@ export class Auth {
    * @param {BindWithProviderRequest} params A BindWithProviderRequest object.
    * @return {Promise<void>} A Promise<any> object.
    */
-  public async bindWithProvider(params: BindWithProviderRequest): Promise<void> {
+  public async bindWithProvider(params: BindWithProviderRequest, credentials?: Credentials): Promise<void> {
     return this.config.request<any>(ApiUrls.PROVIDER_BIND_URL, {
       method: 'POST',
       body: params,
       withCredentials: true,
+      getCredentials: credentials ? () => credentials : undefined,
     })
   }
 
@@ -487,9 +663,14 @@ export class Auth {
 
   /**
    * Get the user info.
+   * @param params.getCredentials Optional custom getCredentials function to bypass default getCredentials() and avoid deadlock
    * @return {Promise<UserInfo>} A Promise<UserProfile> object.
    */
-  public async getUserInfo(params: { version?: string; query?: string } = {}): Promise<UserInfo> {
+  public async getUserInfo(params: {
+    version?: string
+    query?: string
+    credentials?: Credentials
+  } = {},): Promise<UserInfo> {
     const res = this.getParamsByVersion(params, 'USER_ME_URL')
 
     if (res.params?.query) {
@@ -500,6 +681,7 @@ export class Auth {
     const userInfo = await this.config.request<UserInfo>(res.url, {
       method: 'GET',
       withCredentials: true,
+      getCredentials: params.credentials ? () => params.credentials : undefined,
     })
 
     if (userInfo.sub) {
@@ -701,7 +883,8 @@ export class Auth {
   }
 
   /**
-   * Patch the user profile.
+   * Patch the user profile. 没有和数据源同步
+   * @deprecated use updateUserBasicInfo
    * @param {UserProfile} params A UserProfile Object.
    * @return {Promise<UserProfile>} A Promise<UserProfile> object.
    */
@@ -912,13 +1095,14 @@ export class Auth {
 
     const payload = deepClone(params)
 
-    const encryptUtils = getEncryptUtils(isEncrypt, this.config.adapter)
+    const encryptUtils = await getEncryptUtils(isEncrypt, this.config.adapter)
 
     if (!encryptUtils) {
       return params
     }
 
     let publicKey = ''
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     let public_key_thumbprint = ''
 
     try {
@@ -1015,9 +1199,10 @@ export class Auth {
    */
   public async modifyPassword(params: ModifyUserBasicInfoRequest): Promise<void> {
     let publicKey = ''
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     let public_key_thumbprint = ''
 
-    const encryptUtils = getEncryptUtils(true, this.config.adapter)
+    const encryptUtils = await getEncryptUtils(true, this.config.adapter)
 
     if (!encryptUtils) {
       throw new Error('do not support encrypt, a encrypt util required.')
@@ -1035,7 +1220,9 @@ export class Auth {
       throw error
     }
 
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     const encrypt_password = params.password ? encryptUtils.getEncryptInfo({ publicKey, payload: params.password }) : ''
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     const encrypt_new_password = encryptUtils.getEncryptInfo({ publicKey, payload: params.new_password })
     return this.config.request(ApiUrls.USER_BASIC_EDIT_URL, {
       method: 'POST',
@@ -1056,9 +1243,10 @@ export class Auth {
    */
   public async modifyPasswordWithoutLogin(params: ModifyPasswordWithoutLoginRequest): Promise<void> {
     let publicKey = ''
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     let public_key_thumbprint = ''
 
-    const encryptUtils = getEncryptUtils(true, this.config.adapter)
+    const encryptUtils = await getEncryptUtils(true, this.config.adapter)
 
     if (!encryptUtils) {
       throw new Error('do not support encrypt, a encrypt util required.')
@@ -1076,7 +1264,9 @@ export class Auth {
       throw error
     }
 
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     const encrypt_password = params.password ? encryptUtils.getEncryptInfo({ publicKey, payload: params.password }) : ''
+    // eslint-disable-next-line @typescript-eslint/naming-convention
     const encrypt_new_password = encryptUtils.getEncryptInfo({ publicKey, payload: params.new_password })
     return this.config.request(ApiUrlsV2.AUTH_RESET_PASSWORD, {
       method: 'POST',
@@ -1088,4 +1278,19 @@ export class Auth {
       },
     })
   }
+
+  /**
+   * Restore URL state after OAuth callback
+   */
+  private restoreUrlState(search?: string, hash?: string): void {
+    if (search === undefined) return
+    try {
+      const url = new URL(window.location.href)
+      url.search = search
+      url.hash = hash || ''
+      window.history.replaceState(null, '', url.toString())
+    } catch {
+      // ignore
+    }
+  }
 }

package/src/auth/auth-error.ts

@@ -0,0 +1,21 @@
+export class AuthError extends Error {
+  /**
+   * Error code associated with the error. Most errors coming from
+   * HTTP responses will have a code, though some errors that occur
+   * before a response is received will not have one present. In that
+   * case {@link #status} will also be undefined.
+   */
+  code: (string & {}) | undefined
+
+  /** HTTP status code that caused the error. */
+  status: number | undefined
+
+  protected __isAuthError = true
+
+  constructor(error) {
+    super(error.error_description || error.message)
+    this.name = 'AuthError'
+    this.status = error.error
+    this.code = error.error_code
+  }
+}

package/src/auth/consts.ts

@@ -119,3 +119,31 @@ export enum ErrorType {
   CAPTCHA_REQUIRED = 'captcha_required',
   CAPTCHA_INVALID = 'captcha_invalid',
 }
+
+export const LOGIN_STATE_CHANGED_TYPE = {
+  SIGN_OUT: 'sign_out',
+  SIGN_IN: 'sign_in',
+  CREDENTIALS_ERROR: 'credentials_error',
+}
+
+export const AUTH_STATE_CHANGED_TYPE = {
+  SIGNED_OUT: 'SIGNED_OUT',
+  SIGNED_IN: 'SIGNED_IN',
+  INITIAL_SESSION: 'INITIAL_SESSION',
+  PASSWORD_RECOVERY: 'PASSWORD_RECOVERY',
+  TOKEN_REFRESHED: 'TOKEN_REFRESHED',
+  USER_UPDATED: 'USER_UPDATED',
+  BIND_IDENTITY: 'BIND_IDENTITY',
+}
+
+export const EVENTS = {
+  // 登录态改变后触发
+  LOGIN_STATE_CHANGED: 'loginStateChanged',
+  // 授权态改变后触发
+  AUTH_STATE_CHANGED: 'authStateChanged',
+}
+
+export const OAUTH_TYPE = {
+  SIGN_IN: 'sign_in',
+  BIND_IDENTITY: 'bind_identity',
+}

package/src/auth/models.ts

@@ -286,7 +286,7 @@ export interface PatchProviderTokenResponse {
 
 export interface GenProviderRedirectUriRequest {
   provider_id: string
-  redirect_uri: string
+  redirect_uri?: string
   /**
    * @deprecated
    */
@@ -338,6 +338,12 @@ export interface UserProfile {
   zoneinfo?: string
   locale?: string
   created_from?: string
+  created_at?: string
+  updated_at?: string
+  loginType?: string
+  avatarUrl?: string
+  location?: any
+  hasPassword?: boolean
 }
 
 interface UserProvider {
@@ -465,8 +471,8 @@ export interface QueryUserProfileResponse {
 }
 
 export interface ResetPasswordRequest extends BaseRequest {
-  email: string
-  phone_number: string
+  email?: string
+  phone_number?: string
   new_password: string
   verification_token: string
 }
@@ -532,7 +538,7 @@ export interface SignoutRequest {
   state?: string
 }
 
-export interface SignoutReponse {
+export interface SignoutResponse {
   redirect_uri?: string
 }
 
@@ -622,6 +628,8 @@ export interface ModifyUserBasicInfoRequest {
   gender?: 'MALE' | 'FEMALE'
   password?: string // 旧密码
   new_password?: string // 新密码
+  email?: string
+  phone?: string
 }
 
 export interface GetUserBehaviorLog {
@@ -651,4 +659,5 @@ export interface ToDefaultLoginPage {
   config_version?: 'env' | string; // 登录配置，默认env（托管登录页）
   redirect_uri?: string; // 登录后回调地址，默认当前地址
   app_id?: string; // 应用id，托管登录页不需要传
+  query?: Record<string, any> // 跳转登录链接携带的自定义参数，会拼接在链接后面
 }

package/src/captcha/captcha-dom.ts

@@ -0,0 +1,178 @@
+import { CaptchaToken } from '@cloudbase/adapter-interface'
+import { CloudbaseEventEmitter } from '@cloudbase/utilities/dist/cjs/libs/events'
+import { parseCaptcha } from '@cloudbase/utilities/dist/cjs/libs/util'
+import { Auth } from '../auth/apis'
+
+// 防抖函数实现
+const debounce = (func: Function, delay: number) => {
+  let timeoutId: NodeJS.Timeout
+  return (...args: any[]) => {
+    clearTimeout(timeoutId)
+    timeoutId = setTimeout(() => func.apply(null, args), delay)
+  }
+}
+
+const eventBus = new CloudbaseEventEmitter()
+
+const CAPTCHA_EVENT = {
+  CAPTCHA_DATA_CHANGE: 'captchaDataChange',
+  RESOLVE_CAPTCHA_DATA: 'resolveCaptchaData',
+}
+
+// 图形验证码弹窗样式类
+const CAPTCHA_STYLES = {
+  overlay: 'position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:999',
+  modal:
+    'position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:320px;padding:20px;background:#fff;border-radius:8px;box-shadow:0 0 10px rgba(0,0,0,0.2);z-index:1000',
+  prompt: 'margin-bottom:15px',
+  captchaWrap: 'display:flex;align-items:center;justify-content:space-between;margin-bottom:15px',
+  captchaImg: 'width:100%;height:auto;border:1px solid #eee',
+  refreshBtn:
+    'padding:10px 8px;background:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;flex:1;white-space:nowrap;margin-left:10px',
+  input:
+    'width:100%;padding:14px 16px;margin-bottom:15px;box-sizing:border-box;border:2px solid #e8ecf4;border-radius:10px;font-size:15px',
+  confirmBtn: 'width:100%;padding:10px;background:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer',
+  loading: 'background:#6c757d;cursor:not-allowed',
+}
+
+/**
+ * 显示图形图形验证码
+ * @param param0
+ */
+const genCaptchaDom = ({ oauthInstance, captchaState }) => {
+  const CAPTCHA_IMG_ID = 'captcha-image'
+
+  // 刷新图形验证码函数
+  const refreshCaptcha = async () => {
+    try {
+      const result = await oauthInstance.createCaptchaData({ state: captchaState.state })
+      captchaState = { ...captchaState, captchaData: result.data, token: result.token }
+      ;(document.getElementById(CAPTCHA_IMG_ID) as HTMLImageElement).src = result.data
+    } catch (error) {
+      console.error('刷新图形验证码失败', error)
+    }
+  }
+
+  // 创建元素并设置样式
+  const createElement = (tag: string, styles?: string, text?: string) => {
+    const el = document.createElement(tag)
+    if (styles) el.style.cssText = styles
+    if (text) el.textContent = text
+    return el
+  }
+
+  // 创建遮罩层和弹窗
+  const overlay = createElement('div', CAPTCHA_STYLES.overlay)
+  const modal = createElement('div', CAPTCHA_STYLES.modal)
+
+  // 添加提示文字
+  modal.appendChild(createElement('p', CAPTCHA_STYLES.prompt, '请输入你看到的字符：'))
+
+  // 图形验证码区域
+  const captchaWrap = createElement('div', CAPTCHA_STYLES.captchaWrap)
+  const captchaImg = createElement('img', CAPTCHA_STYLES.captchaImg) as HTMLImageElement
+  captchaImg.id = CAPTCHA_IMG_ID
+  captchaImg.src = captchaState.captchaData
+  captchaWrap.appendChild(captchaImg)
+
+  // 刷新按钮
+  const refreshBtn = createElement('button', CAPTCHA_STYLES.refreshBtn, '刷新') as HTMLButtonElement
+  refreshBtn.onclick = debounce(async () => {
+    refreshBtn.textContent = '加载中...'
+    refreshBtn.disabled = true
+    refreshBtn.style.cssText = `${CAPTCHA_STYLES.refreshBtn};${CAPTCHA_STYLES.loading}`
+
+    try {
+      await refreshCaptcha()
+    } finally {
+      refreshBtn.textContent = '刷新'
+      refreshBtn.disabled = false
+      refreshBtn.style.cssText = CAPTCHA_STYLES.refreshBtn
+    }
+  }, 500)
+  captchaWrap.appendChild(refreshBtn)
+  modal.appendChild(captchaWrap)
+
+  // 输入框
+  const input = createElement('input', CAPTCHA_STYLES.input) as HTMLInputElement
+  input.type = 'text'
+  input.placeholder = '输入字符'
+  input.maxLength = 4
+  modal.appendChild(input)
+
+  // 错误提示元素
+  const errorMsg = createElement(
+    'div',
+    'color:#dc3545;font-size:12px;margin-bottom:10px;display:none;padding:8px;background:#f8d7da;border:1px solid #f5c6cb;border-radius:4px',
+  )
+  modal.appendChild(errorMsg)
+
+  // 显示错误提示
+  const showError = (message: string) => {
+    errorMsg.textContent = message
+    errorMsg.style.display = 'block'
+  }
+
+  // 确定按钮
+  const confirmBtn = createElement('button', CAPTCHA_STYLES.confirmBtn, '确定') as HTMLButtonElement
+  confirmBtn.onclick = debounce(async () => {
+    const inputValue = input.value.trim()
+    if (!inputValue) {
+      showError('请输入字符')
+      return
+    }
+
+    // 隐藏之前的错误提示
+    errorMsg.style.display = 'none'
+
+    confirmBtn.textContent = '验证中...'
+    confirmBtn.disabled = true
+    confirmBtn.style.cssText = `${CAPTCHA_STYLES.confirmBtn};${CAPTCHA_STYLES.loading}`
+
+    try {
+      const verifyResult = await oauthInstance.verifyCaptchaData({
+        token: captchaState.token,
+        key: inputValue,
+      })
+      eventBus.fire(CAPTCHA_EVENT.RESOLVE_CAPTCHA_DATA, verifyResult)
+      console.log('图形验证码校验成功')
+      document.body.removeChild(overlay)
+      document.body.removeChild(modal)
+    } catch (error) {
+      console.error('图形验证码校验失败', error)
+      // 根据错误类型显示不同的错误提示
+      const errorMessage = error.error_description || '图形验证码校验失败'
+      showError(errorMessage)
+
+      // 清空输入框并刷新图形验证码
+      input.value = ''
+      input.focus()
+      await refreshCaptcha()
+    } finally {
+      confirmBtn.textContent = '确定'
+      confirmBtn.disabled = false
+      confirmBtn.style.cssText = CAPTCHA_STYLES.confirmBtn
+    }
+  }, 500)
+  modal.appendChild(confirmBtn)
+
+  // 插入页面
+  document.body.appendChild(overlay)
+  document.body.appendChild(modal)
+}
+
+export const openURIWithCallback = async (url: string, oauthInstance?: Auth): Promise<CaptchaToken> => {
+  // 解析URL中的图形验证码参数
+  const { captchaData, state, token } = parseCaptcha(url)
+
+  genCaptchaDom({ oauthInstance, captchaState: { captchaData, state, token } })
+
+  // 监听图形验证码校验结果
+  return new Promise((resolve) => {
+    console.log('等待图形验证码校验结果...')
+    eventBus.on(CAPTCHA_EVENT.RESOLVE_CAPTCHA_DATA, (res) => {
+      // auth.verifyCaptchaData的校验结果
+      resolve(res?.data)
+    })
+  })
+}