I struggle with user authentication and authorization using AngularFire.
The problem is that after authorizing an authorized user and displaying data from Firebase, if I log out of the system, the data is still displayed. I can separate the data from the area ( delete $scope.data) that does not display it, but if I log in again as an unauthorized user, the link will be reassigned and the data is still there.
I think the data is stored somewhere on the client side. But how can I destroy him? I tried replacing the Firebase link with a new one every time I logged out, in vain.
Here is the code:
<!DOCTYPE html>
<html ng-app="app">
<head>
<title></title>
</head>
<body ng-controller="ctrl">
<div ng-hide="loggedIn">Not logged In</div>
<button ng-hide="loggedIn" ng-click="login()">Log in</button>
<div>The data: {{data}}</div>
<button ng-show="loggedIn" ng-click="logout()">Log out</button>
</body>
<script type="text/javascript" src="bower_components/angular/angular.js"></script>
<script type="text/javascript" src="bower_components/firebase/firebase.js"></script>
<script type="text/javascript" src="bower_components/firebase-simple-login/firebase-simple-login.js"></script>
<script type="text/javascript" src="bower_components/angularfire/angularfire.js"></script>
<script type="text/javascript">
angular.module('app', ['firebase'])
.controller('ctrl', function ($scope, $firebase, $firebaseSimpleLogin) {
var ref = new Firebase(<ref>);
var ngref = $firebase(ref);
var auth = $firebaseSimpleLogin(ref);
$scope.loggedIn = !!auth.user;
$scope.login = function () {
auth.$login('google').then(
function (user) {
$scope.data = ngref.name;
$scope.loggedIn = true;
},
function (error) {
throw error;
});
};
$scope.logout = function () {
$scope.loggedIn = false;
auth.$logout();
};
})
</script>
</html>
EDIT
, AngularFire. API- vanilla Firebase, .
var auth = new FirebaseSimpleLogin(ref, function (error, user) {
if (error) {
throw error;
} else if (user) {
$scope.$apply(function () {
$scope.loggedIn = true;
$scope.data = ref;
});
} else {
$scope.$apply(function () {
delete $scope.data;
$scope.loggedIn = false;
});
}
});
$scope.loggedIn = false;
$scope.login = function () {
auth.login('google');
};
$scope.logout = function () {
auth.logout();
};