在 Cordova 中使用 OAuth 提供方进行身份验证

通过 Firebase JS SDK,您可以让 Firebase 用户在 Cordova 环境中使用任何受支持的 OAuth 提供方进行身份验证。您可以使用 Firebase SDK 执行登录流程,或者手动实施 OAuth 流程,并将生成的 OAuth 凭据传递至 Firebase,从而集成任何受支持的 OAuth 提供方。

为 Cordova 设置 Firebase 身份验证

  1. 将 Firebase 添加至您的 JavaScript 项目。添加 Firebase 代码段时,请注意 authDomain 配置变量,它应类似于 my-app.firebaseapp.com。如果使用的是自定义域名而非 Firebase 配置的 firebaseapp.com 域名,则应改用该自定义域名。

  2. 要设置 Android 应用,请将您的 Android 应用添加到 Firebase 控制台并输入您的应用的详细信息。您不需要生成的 google-services.json

  3. 要设置 iOS 应用,请创建一个 iOS 应用并将其添加到 Firebase 控制台。在稍后安装自定义网址架构插件时,您将需要用到 iOS 软件包 ID。

  4. 启用 Firebase 动态链接:

    1. Firebase 控制台中,打开 Dynamic Links(动态链接)部分。
    2. 如果您尚未接受动态链接条款,并且也未创建动态链接网域,请立即完成这些操作。

      如果您已经创建了动态链接网域,请记下它。动态链接网域通常采用如下格式:

      example.page.link

      配置 iOS 或 Android 应用以拦截传入链接时,您需要用到此值。

  5. 在 Firebase 控制台中启用 Google 登录:

    1. Firebase 控制台中,打开 Authentication(身份验证)部分。
    2. 登录方法标签中,启用 Google 登录方法并点击保存
  6. 在 Cordova 项目中安装所需的插件。

    # Plugin to pass application build info (app name, ID, etc) to the OAuth widget.
    cordova plugin add cordova-plugin-buildinfo --save
    # Plugin to handle Universal Links (Android app link redirects)
    cordova plugin add cordova-universal-links-plugin --save
    # Plugin to handle opening secure browser views on iOS/Android mobile devices
    cordova plugin add cordova-plugin-browsertab --save
    # Plugin to handle opening a browser view in older versions of iOS and Android
    cordova plugin add cordova-plugin-inappbrowser --save
    # Plugin to handle deep linking through Custom Scheme for iOS
    # Substitute *com.firebase.cordova* with the iOS bundle ID of your app.
    cordova plugin add cordova-plugin-customurlscheme --variable \
        URL_SCHEME=com.firebase.cordova --save
    
  7. 将以下配置添加到 Cordova config.xml 文件中,其中 AUTH_DOMAIN 是步骤 (1) 中的域名,DYNAMIC_LINK_DOMAIN 是步骤 (3c) 中的域名。

    <universal-links>
        <host name="DYNAMIC_LINK_DOMAIN" scheme="https" />
        <host name="AUTH_DOMAIN" scheme="https">
            <path url="/__/auth/callback"/>
        </host>
    </universal-links>
    

    示例配置可能如下所示:

    <universal-links>
        <host name="example.page.link" scheme="https" />
        <host name="example-app.firebaseapp.com" scheme="https">
            <path url="/__/auth/callback"/>
        </host>
    </universal-links>
    

    如果使用自定义域名 auth.custom.domain.com,请将 my-app.firebaseapp.com 替换为该域名。

    对于 Android 应用,launchMode 应该采用 singleTask

    <preference name="AndroidLaunchMode" value="singleTask" />
    

使用 Firebase SDK 处理登录流程

  1. Firebase 身份验证依赖于 deviceReady 事件才能正确确定当前的 Cordova 环境。确保在触发该事件后,Firebase 应用实例完成初始化。

  2. 创建 Google 提供方对象实例:

    var provider = new firebase.auth.GoogleAuthProvider();
    
  3. 使用具有 signInWithRedirect 的 Google 提供方对象进行 Firebase 身份验证。请注意,Cordova 不支持 signInWithPopup

    firebase.auth().signInWithRedirect(provider).then(function() {
      return firebase.auth().getRedirectResult();
    }).then(function(result) {
      // This gives you a Google Access Token.
      // You can use it to access the Google API.
      var token = result.credential.accessToken;
      // The signed-in user info.
      var user = result.user;
      // ...
    }).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      var errorMessage = error.message;
    });
    
  4. 要处理应用 Activity 在登录操作完成之前被销毁的情况,请在应用加载时调用 getRedirectResult

    firebase.auth().getRedirectResult().then(function(result) {
      if (result.credential) {
        // This gives you a Google Access Token.
        // You can use it to access the Google API.
        var token = result.credential.accessToken;
        // The signed-in user info.
        var user = result.user;
        // ...
      }
    }).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      var errorMessage = error.message;
    });
    

    您可使用同一机制通过 linkWithRedirect 来关联新的提供方,或者使用 reauthenticateWithRedirect 通过现有提供方重新进行身份验证。

发送以下问题的反馈:

此网页
需要帮助?请访问我们的支持页面