Firebase 身份验证、phonegap 构建和设备就绪事件

Firebase auth, phonegap build and the deviceready event

我想通过 Phonegap 在线构建使用 firebase 实时数据库从我的 vanilla Js 代码生成一个 android 应用程序,除了 firebase facebook/Google auth.

当我点击 facebook 登录 img 时,出现众所周知的 location.protocol 错误。使用 Google auth 错误消息是 "no universal links plugin installed".

firebase 文档 (https://firebase.google.com/docs/auth/web/cordova#handle_the_sign-in_flow_with_the_firebase_sdk) 说 "Firebase Auth depends on deviceReady event in order to determine correctly the current Cordova environment. Ensure the Firebase App instance is initialized after that event is triggered."

具体是什么意思?在 deviceready 事件后调用 firebase.InitalizeApp() 函数?不幸的是,我的应用程序从代码开始就需要 firebase 应用程序。 (deviceready 事件触发,admob 插件在 deviceready 事件之后启动并且工作正常。) 谁能告诉我一个 deveiceready event-firebase 应用程序启动的工作示例? :)

//google auth code:
function googleAuth() {

    var provider = new firebase.auth.GoogleAuthProvider();
    provider.addScope('https://www.googleapis.com/auth/contacts.readonly');

    //firebase.auth().signInWithPopup(provider).then(function (result) {
        firebase.auth().signInWithRedirect(provider).then(function() {
            return firebase.auth().getRedirectResult();
        // 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;
        alert(errorMessage);
        // The email of the user's account used.
        var email = error.email;
        // The firebase.auth.AuthCredential type that was used.
        var credential = error.credential;
        // ...
    });

    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;
        // The email of the user's account used.
        var email = error.email;
        // The firebase.auth.AuthCredential type that was used.
        var credential = error.credential;
        // ...
        return;
    });
}

//face auth code
function faceAuth() {

    if (!firebase.auth().currentUser) {
        // [START createprovider]
        var provider = new firebase.auth.FacebookAuthProvider();
        // [END createprovider]
        // [START addscopes]
        //provider.addScope('user_likes');
        // [END addscopes]
        // [START signin]
        //firebase.auth().signInWithRedirect(provider).then(function (result) {
        firebase.auth().signInWithPopup(provider).then(function (result) {
            // This gives you a Facebook Access Token. You can use it to access the Facebook API.
            var token = result.credential.accessToken;
            // The signed-in user info.
            var user = result.user;
            // [START_EXCLUDE]
            //document.getElementById('quickstart-oauthtoken').textContent = token;
            // [END_EXCLUDE]
        }).catch(function (error) {
            // Handle Errors here.
            var errorCode = error.code;
            var errorMessage = error.message;
            alert(errorMessage);
            // The email of the user's account used.
            var email = error.email;
            // The firebase.auth.AuthCredential type that was used.
            var credential = error.credential;
            // [START_EXCLUDE]
            if (errorCode === 'auth/account-exists-with-different-credential') {
                //alert('You have already signed up with a different auth provider for that email.');
                // If you are using multiple auth providers on your app you should handle linking
                // the user's accounts here.
            } else {
                console.error(error);
            }
            // [END_EXCLUDE]
        });
        // [END signin]
    } else {
        // [START signout]
        firebase.auth().signOut();
        // [END signout]
    }

在设备就绪事件上将 firebase 添加到项目后,使用以下代码

var firebaseConfig = {
        apiKey: "***********8",
        authDomain: "*********.firebaseapp.com",
        databaseURL: "https://*********.firebaseio.com",
        projectId: "*********8",
        storageBucket: "",
        messagingSenderId: "000000000000",
        appId: "1:0000000000:web:a0a0a0a0a0a0a0a0"
      };
      // Initialize Firebase
      if(!firebase.apps.length){
        firebase.initializeApp(firebaseConfig);
      }

这就是 firebase 的初始化方式。是否将以上代码放入设备就绪取决于 firebase 在应用程序中的访问方式。

请按照此处的说明进行操作 Firebase Auth for Cordova 如果 universal-links 标记未将数据复制到 android 上的清单文件,请到此处。

我正在使用 PhoneGap Build。问题是通用链接标签没有复制到 AndroidManifest.xml。所以解决方案是

  1. 安装 cordova-universal-links-plugin-fix
  2. 如果你想在 config.xml 中保留 universal-links 标签,请保留它。但还要将此添加到 config.xml

在顶部的小部件标签中添加

xmlns:android="http://schemas.android.com/apk/res/android"

在 config.xml 中的任意位置添加以下代码 我更喜欢在插件之前或在 unvirsal-links 标签旁边

<config-file target="AndroidManifest.xml" parent="/manifest/application/activity">
    <intent-filter android:autoVerify="true">
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data android:host="****-***.firebaseapp.com" android:pathPrefix="/__/auth/callback" android:scheme="https" />
    </intent-filter>
</config-file>

现在,当使用 phonegapbuild 或本地 cordova CLI 构建应用程序时,它会复制本应位于清单文件中的通用链接数据。当应用程序运行并调用 firebase.auth().getRedirectResult() 时,它不会给出类似

的任何错误

auth/cancelled 由用户。重定向在完成之前被用户取消

使用 cordova CLI 构建应用程序的用户请在 运行 cordova build android 之后确保清单文件中的 activity 标签下有上述 intent-filter 标签。