在 facebook 上使用 firebase 身份验证答案

【问题标题】：Using firebase auth with facebook在 facebook 上使用 firebase 身份验证
【发布时间】：2016-06-11 20:38:15
【问题描述】：

在我的安卓手机测试期间尝试登录我的网络应用程序时，我收到以下消息：

“firebase.js:75 未捕获的错误：此应用程序运行的环境不支持此操作。“location.protocol”必须是 http 或 https..”

我将我的 firebase url 添加到我的 fb 应用程序上的有效 OAuth 重定向 URI - https://.firebaseio.com/ 我在身份验证部分将我的应用程序 ID 和名称添加到 firebase。我错过了什么吗？谢谢

我在这里使用 chrome 远程调试：file:///android_asset/www/index.html#/app/people

这可能是它大惊小怪的原因吗？

var provider = new firebase.auth.FacebookAuthProvider();

console.log(provider);
  firebase.auth().signInWithPopup(provider).then(function(result) {
 // This gives you a Facebook Access Token. You can use it to access theFacebook API.
   var token = result.credential.accessToken;
// The signed-in user info.
  var user = result.user;
  console.log(user, token);
  UserService.setUser(user, token);
// ...
}).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;
  console.log(errorCode);

  });

【问题讨论】：

当您使用file:// 加载文件时，身份验证将不起作用。您需要从适当的 Web 服务器加载 HTML 以使其工作。
是的。我是这么想的。我使用 phonegaps 轻量级 adb 在我的手机上运行该应用程序。也许，我可以以某种方式在节点之外运行它。有什么建议？谢谢。
只需启动本地服务器。有很多节点模块，只需在 npm 上搜索即可。
我正在使用 Ionic 2 框架并在 Android 中遇到同样的问题！在浏览器中，它工作正常。
好的。谢谢。我会去做。您是否必须将 deviceReady 更改为 documentReady？让它在你的浏览器中运行？

标签： firebase firebase-authentication facebook-authentication

【解决方案1】：

找到了一个关于 Facebook 登录的解决方法，它适用于 Ionic 1，原则上也应该适用于 Ionic 2。

添加 Cordova 插件 cordova-plugin-facebook4 在授权代码中，我添加了以下内容：

if ((window.cordova && device.platform == 'iOS') || (window.cordova && device.platform == 'Android')) {
    facebookConnectPlugin.login(['public_profile'], function(result) {
        provider = firebase.auth.FacebookAuthProvider.credential(result.authResponse.accessToken);
        Auth.$signInWithCredential(provider).then(function(authData) {
            // User successfully logged in
        }).catch(function(error) {
            // Login error
        });
    }, function(error) {
        // Login error
    });
} else {
    provider = new firebase.auth.FacebookAuthProvider();
    Auth.$signInWithPopup(provider).then(function(authData) {
        // User successfully logged in
    }).catch(function(error) {
        // Login error
    });
}

基本上，这将确保它在设备上使用 Facebook 登录 SDK，而在浏览器中运行时使用 Firebase signInWithPopup

【讨论】：

【解决方案2】：

以下操作：signInWithPopup、signInWithRedirect、linkWithPopup、linkWithRedirect 和 getRedirectResult 仅支持从 http/https 环境。您可以使用文件环境中的剩余 api。

【讨论】：