Блог

Я новичок в Angular и Firebase. В настоящее время я разрабатываю ионное приложение. Каким-то образом я узнал, что для использования Firebase мне нужно настроить систему аутентификации (я предпочитаю Google).

Было непросто интегрировать код в AngularJS, который упоминался на официальном веб-сайте Firebase. Итак, я просто взял чей-то рабочий код и заменил его URL-адрес базы данных Firebase на мой, я мог бы это сделать. Но это была ошибка.

Это неизмененный код и его вывод (который работает, как ожидалось).

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])
  

Итак, сначала я удалил его URL Firebase, чтобы добавить свой, и получил эту ошибку:

Мы обнаружили, что вы используете SDK для аутентификации версии v2.x или ниже в проекте, который был создан на консоли.firebase.google.com . Для проектов, созданных в новой консоли, необходимо использовать SDK для проверки подлинности версии 3.0.0 или выше.

Затем я обновил firebase.js файл до версии 3.4.1. Затем я получил ошибку ссылки в консоли разработчика браузера: ReferenceError: Firebase не определена

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

Итак, что мне, наконец, нужно, это работающий Google OAuth с Firebase 3.x и AngularJS.

Хотя вы не предоставили достаточно примеров своего кода (недостаточно внедрения зависимостей), я думаю, что основная проблема, с которой вы столкнулись, заключается в том, что вы используете старые примеры кода с новой версией 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);
});
  

Имейте в виду, что вы должны включить аутентификацию с помощью Google (или любого другого поставщика) в вашей консоли Firebase. Для получения подробных инструкций, пожалуйста, проверьте эту ссылку.