即时模式自动登录 Firebase

immediate mode automatic login with firebase

本文关键字：登录 Firebase 模式      更新时间：2023-09-26

当用户单击登录按钮时，将调用登录函数：

login: function() {
        ref.auth.$authWithOAuthPopup('facebook').then(user.setUser).catch(function(error) {
          console.error('Authentication failed: ', error);
        });
      }

我使用登录按钮来避免弹出窗口阻止程序。

现在，每次用户访问我的网站或刷新页面时，他们都必须单击登录。如果他们之前已经登录过，有没有办法自动/立即登录？这样，我只能在立即登录失败时显示登录按钮。

使用 $onAuth(fn) 方法将允许您在用户登录时触发函数。 

auth.$onAuth(function(authData) {
  // fires off whenever a user logs in
});

当登录用户刷新页面时，此回调函数仍将触发。

如果有人感兴趣，这里是我的最终代码：

视图：

<button class="btn btn-primary"
            ng-if="!user.isLoggedIn"
            ng-click="login()">
        Login (required)
    </button>

控制器：

angular.module('kbCliApp')
  .controller('MainCtrl', function ($scope, $http, user, worldRank, keyboard) {
    $scope.worldRank = worldRank;
    $scope.keyboard = keyboard;
    $scope.user = user;
    $scope.login = user.login;

  });

用户服务：

angular.module('kbCliApp')
  .factory('user', ['$q', 'ref', 'keyboard', function ($q, ref, keyboard) {
    var defered = $q.defer();
    var user = {
      userinfoPromise: defered.promise,
      //displayName: 'Robert King',
      isLoggedIn: false, //change
      uid: null, //change
      //userinfo: ref.userinfo(13), //remove
      //pic: 'https://fbcdn-profile-a.akamaihd.net/hprofile-ak-xap1/v/t1.0-1/p100x100/74680_10201639982424304_1740699050_n.jpg?oh=55e890dac49d2d182b602d6d1a334403&oe=550C3CBD&__gda__=1427675679_ef1dafcdfc685a38e0b8e8266f049929',
      login: function() {
        ref.auth.$authWithOAuthPopup('facebook').then(
          function() {
            console.log('setUser called from auth.$onAuth');
          }
        ).catch(function(error) {
          console.error('Authentication failed: ', error);
        });
      },
      setUser: function(authData) {
        if (!authData) {
          console.log('no auth data');
          return;
        }
        user.displayName = authData.facebook.displayName;
        user.uid = authData.uid;
        user.isLoggedIn = true;
        user.pic = authData.facebook.cachedUserProfile.picture.data.url;
        user.authData = authData;
        user.userinfo = ref.userinfo(user.uid);
        defered.resolve(user.userinfo);
      },
      setCurrentWPM: function(/*wpm*/) {
        //do nothing - we don't currently show wpm live.
//        if (user.isLoggedIn && user.userinfo.currentWPM !== wpm) {
//          user.userinfo.currentWPM = wpm;
//          user.userinfo.$save();
//        }
      },
      setRecordWPM: function(wpm) {
        if (user.isLoggedIn) {
          user.userinfo.recordWPM = user.userinfo.recordWPM || {};
          user.userinfo.recordWPM[keyboard.currentHand] = wpm;
        }
      },
      saveUser: function() {
        if (user.isLoggedIn) {
          user.userinfo.$save();
        }
      }
    };
    ref.auth.$onAuth(user.setUser);
    return user;
  }]);

参考服务：

'use strict';
/* global Firebase */
angular.module('kbCliApp')
  .factory('ref',['$firebase', '$firebaseAuth', function ($firebase, $firebaseAuth) {
    var ref = new Firebase('https://something-secure.firebaseio.com/');
    var wrapper = {
      auth: $firebaseAuth(ref),
      userinfo: function(uid) {
        return $firebase(ref.child('userinfo').child(uid)).$asObject();
      },
      wpmCounts: function() {
        return $firebase(ref.child('wpmCounts')).$asObject();
      },
      wpmTransaction: function(wpm, amount, side) {
        return $firebase(ref.child('wpmCounts').child(side).child(wpm))
          .$transaction(function(count) {
            return count + amount;
          });
      }
    };
    return wrapper;
  }]);

以下是Facebook登录的示例，其中会话将在浏览器关闭时过期，我们还请求一些扩展权限：

var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com");
ref.authWithOAuthPopup("facebook", function(error, authData) { /* Your Code */ }, {
  remember: "sessionOnly",
  scope: "email,user_likes"
});

这对我很有帮助。

相关文章：