Question

我正在使用Firebase 2.x.x来保存我的AngularJS应用程序的数据。我一直在将我的应用程序迁移到新控制台。身份验证失败，并显示以下错误：

在console.firebase.google.com上创建的项目必须使用firebase.google.com/docs/auth /中提供的新Firebase身份验证SDK。

所以我一直在查看以下resources。

似乎我需要重构以下文件中的代码：

的index.html
app.js
以下auth文件夹中的2个文件（auth.ctr.js和auth.tpl.html）：

由于我使用Firebase 2.x.x来保存后端的数据，因此我重构了index.html，如下所示：

<!-- Firebase -->
<script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
<!-- AngularFire -->
<script src="https://cdn.firebase.com/libs/angularfire/1.1.3/angularfire.min.js"></script>


<script src="https://www.gstatic.com/firebasejs/3.6.9/firebase.js"></script>
<script>
  // Initialize Firebase
    var config = {
        apiKey: "key",
        authDomain: "xxx.firebaseapp.com",
        databaseURL: "xxx.firebaseio.com",
        storageBucket: "xxx.appspot.com",
        messagingSenderId: "id"
    };
    firebase.initializeApp(config);
</script>

以下是我的app.js文件与路由的摘录。我需要在这里重构什么才能使它符合Firebase 3.x.x的要求？

angular
    .module('ngClassifieds', ['ngMaterial', 'ui.router', 'firebase'])
    .run(["$rootScope", "$state", function ($rootScope, $state) {
        $rootScope.$on("$stateChangeError", function (event, toState, toParams, fromState, fromParams, error) {
            // We can catch the error thrown when the $requireAuth promise is rejected
            // and redirect the user back to the home page
            if (error === "AUTH_REQUIRED") {
                $state.go("auth");
            }
        });
    }])
    .config(function ($mdThemingProvider, $stateProvider, $urlRouterProvider) {
        $mdThemingProvider
            .theme('default')
            .primaryPalette('blue-grey')
            .accentPalette('orange')
            //.backgroundPalette('blue-grey');
        $urlRouterProvider.otherwise('/auth');
        $stateProvider
            .state('auth', {
                url : '/auth',
                templateUrl : 'components/auth/auth.tpl.html',
                controller : 'authCtrl',

            })
        $stateProvider
            .state('classifieds', {
                url : '/notes',
                controller : 'classifiedsCtrl',
                resolve : {
                    // controller will not be loaded until $requireAuth resolves
                    // Auth refers to our $firebaseAuth wrapper in the example above
                    "currentAuth" : ["auth", function (auth) {
                            // $requireAuth returns a promise so the resolve waits for it to complete
                            // If the promise is rejected, it will throw a $stateChangeError (see above)
                            return auth.ref.$requireAuth();
                        }
                    ]
                }
            })

以下是我的auth.ctr.js文件：

angular
    .module('ngClassifieds')
    .controller('authCtrl', function ($scope, auth, $state) {
        $scope.login = function () {

            /*auth.ref.$authWithPassword({
                email : $scope.email,
                password : $scope.password
            }).then(function (data) {
                $scope.email = null;
                $scope.password = null;
                $state.go('classifieds');
            }).catch (function (error) {
                console.log(error);
            });*/
            firebase.auth().signInWithEmailAndPassword(email, password).catch (function (error) {
                // Handle Errors here.
                var errorCode = error.code;
                var errorMessage = error.message;
                // ...
            });
        }
    });

以下是我的auth.fac.js：

(function () {
    "use strict";
    angular
        .module('ngClassifieds')
        .factory('auth', function ($firebaseAuth) {
            /*var ref = new Firebase('https://xxx.firebaseio.com/');
            return {
                ref : $firebaseAuth(ref),
                user : ref.getAuth()
            }*/
            var config = {
                apiKey : "xxx",
                authDomain : "xxx.firebaseapp.com",
                databaseURL : "xxx.firebaseio.com"
            };
            firebase.initializeApp(config);
            var rootRef = firebase.database().ref();
        });
})();

在此阶段，当我运行应用程序时，我收到以下错误：

FirebaseError: Firebase: Firebase App named '[DEFAULT]' already exists (app/duplicate-app).
    at Z (https://www.gstatic.com/firebasejs/3.6.9/firebase.js:50:364)
    at Object.initializeApp (https://www.gstatic.com/firebasejs/3.6.9/firebase.js:49:29)
    at Object.<anonymous> (http://localhost:8080/components/auth/auth.fac.js:23:14)
    at Object.invoke (http://localhost:8080/node_modules/angular/angular.js:4604:19)
    at Object.enforcedReturnValue [as $get] (http://localhost:8080/node_modules/angular/angular.js:4443:37)
    at Object.invoke (http://localhost:8080/node_modules/angular/angular.js:4604:19)
    at http://localhost:8080/node_modules/angular/angular.js:4403:37
    at getService (http://localhost:8080/node_modules/angular/angular.js:4550:39)
    at injectionArgs (http://localhost:8080/node_modules/angular/angular.js:4574:58)
    at Object.instantiate (http://localhost:8080/node_modules/angular/angular.js:4616:18) <ui-view class="ng-scope" data-ng-animate="1">
(anonymous) @ angular.js:13236
(anonymous) @ angular.js:9965
invokeLinkFn @ angular.js:9494
nodeLinkFn @ angular.js:8978
compositeLinkFn @ angular.js:8226
publicLinkFn @ angular.js:8106
(anonymous) @ angular.js:8447
updateView @ angular-ui-router.js:4021
(anonymous) @ angular-ui-router.js:3959
$broadcast @ angular.js:17143
$state.transition.resolved.then.$state.transition @ angular-ui-router.js:3352
processQueue @ angular.js:15552
(anonymous) @ angular.js:15568
$eval @ angular.js:16820
$digest @ angular.js:16636
$apply @ angular.js:16928
done @ angular.js:11266
completeRequest @ angular.js:11464
requestLoaded @ angular.js:11405

也许它要求太多，但我非常感谢有关如何重构代码的指导，以便我能够正确认证。

Answer 1

如果您将在firebase.com上创建的项目导入firebase.google.com的新控制台，则任何代码都将继续有效。

但是如果你在firebase.google.com上创建一个新项目，遗留的身份验证代码确实无效，你必须更新你的代码。

对于使用常规Firebase JavaScript SDK的应用，upgrade instructions are in the support guides on the Firebase site。

对于AngularFire 1.x应用，您需要：

将Firebase JavaScript SDK更新为3.x版：

<script src="https://www.gstatic.com/firebasejs/3.6.9/firebase.js"></script>

将AngularFire更新为2.x版本

<script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script>

关注instructions for upgrading your code to AngularFire 2.x。

将AngularJS应用程序和Firebase 2.x.x迁移到Firebase 3.x.x的身份验证问题

1 个答案: