Question

我刚开始学习离子框架，并尝试使用firebase实现Facebook登录。我在浏览器中运行此应用程序，我有以下代码，它给我“cordova_not_available”错误。任何人都可以帮助我了解我的尝试有什么问题。

谢谢。

在app.module.js内部

import {Facebook} from '@ionic-native/facebook';
import firebase from 'firebase';

export const firebaseConfig = {
    ....
    ....
};

firebase.initializeApp(firebaseConfig);

Inside home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {Facebook} from '@ionic-native/facebook';
import firebase from 'firebase';

@Component({
    selector: 'page-home',
    templateUrl: 'home.html'
})
export class HomePage {

    constructor(public navCtrl: NavController, public facebook: Facebook) {

    }
    fblogin() {
        var me = this;
        me.facebook.login(['email']).then(res=>{
            const fc = firebase.auth.FacebookAuthProvider.credential(res.authResponse.accessToken);
            firebase.auth().signInWithCredential(fc).then(fs => {
                alert("Firebase sec");
            }).catch(ferr => {
                alert("error");
            })
        }).catch(err=>{
            console.log("JSON.stringify(err)");
        })
    }

}

Answer 1

在使用离子服务器的浏览器中运行应用程序时，Cordova插件不可用。为了能够使用Cordova插件，您需要在模拟器/真实设备上运行该应用程序。

<强>更新

我需要在Android和浏览器上运行app

我能想到的唯一方法是使用平台信息来检查应用是否在移动设备（this.platform.is('cordova')）上运行，如果是，请使用Cordova插件。如果不是，那么在创建网站时，您需要做与您一样的事情，例如使用Firebase的REST API（因此，不使用Cordova插件）

我应该在哪里查看这个平台？

在调用任何与Cordova插件相关的方法之前。所以它可能在您的服务中，或在app.component.ts文件中。只是决定是否需要使用基于Cordova插件的方法，或者是否需要执行使用Web服务的方法。

Answer 2

添加浏览器插件 -ionic cordova plugin add browser

然后通过以下命令运行您的项目 ionic cordova run browser代替ionic serve

Answer 3

Cordova在浏览器中是可用的，因为我们需要安装xampp srver和ripple模拟器然后它才能工作

运行步骤：

1）按照

程序安装Xampp

2）安装Ripple模拟器并在localhost中运行应用程序然后它将起作用

Answer 4

我试图达到相同的目的，sebaferreras是正确的。对于移动版本和浏览器版本，您需要不同的方法。像这样：

import { Injectable } from '@angular/core';
import { Facebook, FacebookLoginResponse } from '@ionic-native/facebook/ngx';
import { AngularFireAuth } from '@angular/fire/auth';
import * as firebase from 'firebase';
import { Platform } from '@ionic/angular';
// ...

@Injectable({
    providedIn: 'root'
})
export class AuthService {

    constructor(
        private fb: Facebook,
        private afAuth: AngularFireAuth,
        private platform: Platform
    ) { }

    /**
     * If it has Cordova support (Android, iOS), it returns true, otherwise false (usually browser).
     */
    private isCordova(): boolean {
        return this.platform.is('cordova');
    }

    doFacebookLogin(): Promise<any> {
        if (this.isCordova()) {
            return new Promise<any>((resolve, reject) => {
                this.fb.login(['email']).then((response: FacebookLoginResponse) => {
                    const credential = firebase.auth.FacebookAuthProvider.credential(response.authResponse.accessToken);
                    this.afAuth.auth.signInWithCredential(credential).then((res) => {
                        resolve(res);
                    });
                }).catch((error) => {
                    reject(error);
                });
            });
        } else {
            return new Promise<any>((resolve, reject) => {
                let provider = new firebase.auth.FacebookAuthProvider();
                this.afAuth.auth.signInWithPopup(provider).then(res => {
                    resolve(res);
                }, err => {
                    console.error(err);
                    reject(err);
                });
            });
        }
    }

    // ...
}

cordova在浏览器中不可用

4 个答案: