为 Google OAuth 迁移 Firebase 2.x 到 3.4.1 AngularJS

Question

我是 Angular 和 Firebase 的新手。我目前正在开发一个 Ionic 应用程序。不知何故，我知道，要使用 Firebase，我需要设置身份验证系统（我更喜欢 Google）。

将代码集成到 AngularJS 中并不容易，这在 Firebase 官方网站上有所提及。所以我只是拿起某人的工作代码并将他的 Firebase 数据库 URL 替换为我的，我可以完成它。但这是一个错误。

这是未更改的代码和他的输出（按预期工作）。

index.html

<script src="lib/angularfire/dist/angularfire.min.js"></script>
<script src="lib/firebase/firebase.js"></script>

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>

app.js

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'firebase'])

.constant('FirebaseUrl', 'https://ionicle.firebaseio.com/')

.service('rootRef', ['FirebaseUrl', Firebase])

所以首先，我删除了他的 Firebase URL 以添加我的并收到此错误：

我们检测到您正在将 v2.x 或更低版本的身份验证 SDK 用于在 console.firebase.google.com 上创建的项目。您必须将 3.0.0 或更高版本的身份验证 SDK 用于已在新控制台中创建的项目。

然后我将firebase.js 文件更新为 3.4.1 版本。然后我在浏览器的开发控制台中得到一个参考错误：ReferenceError: Firebase is not defined

.service('rootRef', ['FirebaseUrl', Firebase])

所以我最终需要的是带有 Firebase 3.x 和 AngularJS 的有效 Google OAuth。

Answer 1

虽然您没有提供足够的代码示例（依赖注入还不够），但我认为您遇到的主要问题是您在新的 Firebase 版本中使用旧的代码示例。

这样的事情：

var app = angular.module('app', ['firebase']);
app.controller('Ctrl', function($scope, $firebaseAuth) {
    var ref = new Firebase('https://...');
    $scope.authObj = $firebaseAuth(ref);
    ...
});

改成这样：

var app = angular.module('app', ['firebase']);
app.controller('Ctrl', function($scope, $firebaseAuth) {

    var config = {
        apiKey: "***",
        authDomain: "***.firebaseapp.com",
        databaseURL: "https://***.firebaseio.com",
        storageBucket: "***.appspot.com",
        messagingSenderId: "***"
    };
    firebase.initializeApp(config);

    $scope.authObj = $firebaseAuth(firebase.auth());
    ...
});

然后在该 authObj 上，您可以为要用于身份验证的客户端添加提供程序（Google/GitHub/Facebook...）：

var provider = new firebase.auth.GoogleAuthProvider();
$scope.authObj.$signInWithPopup(provider).then(function(result) {
    console.log(result);
});

请注意，您必须在 Firebase 控制台中启用 Google（或任何其他提供商）身份验证。有关详细说明，请查看此link。