Auth in firebase 3x

Developer
Size
4,603 Kb
Views
58,696

How do I make an auth in firebase 3x?

Firebase authentication in 3.x and routing based on auth.. What is a auth in firebase 3x? How do you make a auth in firebase 3x? This script and codes were developed by Arun on 12 June 2022, Sunday.

Auth in firebase 3x Previews

Auth in firebase 3x - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Auth in firebase 3x</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <html>
<head> <meta charset="utf-8" /> <title>Test Arun</title> <!-- Firebase 3.0 is a major revision, lots of changes to SDK --> <script src="https://www.gstatic.com/firebasejs/3.2.1/firebase.js"></script> <!-- AngularJS 1.5.x 1.5.8--> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.js"></script>
<!-- library for custom token generator --> <script src="https://rawgit.com/firebase/firebase-token-generator-node/master/dist/firebase-token-generator.js"></script> <!-- AngularFire (for using AngularJS 1.x with Firebase 3.0 --> <!-- Only needed for controller $scope example --> <script src="https://cdn.firebase.com/libs/angularfire/2.0.1/angularfire.js"></script> <!-- AngularFire2 is available for AngularJS 2 (different than AngularFire 2.x) --> <!-- https://github.com/angular/angularfire2 -->
</head>
<!-- <body ng-app="MyApp" style="background-color: #971"> -->
<body ng-app="MyApp" style="background-color: #971"> <a href="#/viewdata">View Data</a> <a href="#/">Home</a> <div ng-view></div> <script type="text/ng-template" id="home.htm"> <div> <h2> Test Auth Firebase - Arun </h2> <input type="text" ng-model="title" ng-hide="btn_hide" placeholder="title"> <input type="text" ng-model="comment" ng-hide="btn_hide" placeholder="comment"><br/><br/> <input type="email" ng-model="username" placeholder="Username"> <input type="password" ng-model="password" placeholder="Password"> Admin<input type="checkbox" ng-model="checkadmin"><span ng-bind="checkadmin"></span> <label ng-model="err.message"> Status : {{err.message}}</label><br/><br/> <button ng-click="logmein(username,password)">Login</button> <button ng-click="regmein(username,password)">Register</button> <button ng-click="logmeout()">Logout</button>	<button ng-click="checkstatus()">Check status</button>	<button ng-click="deleteuser()">Delete User</button>	<button ng-hide="btn_hide" ng-click="populate()">Populate Data</button> <div ng-hide = "btn_hide"><a href="#viewdata">View Data</a></div> <button ng-click="cusauth()">Custom Login</button> </div> </script> <script type="text/ng-template" id="viewData.htm">	<h2> View Data </h2>
<!-- <table border="1px" style="background-color:#999"> <th>Title<td><b/>Comment</td> </th> <tr ng-repeat="ls in lst"> <tr ng-repeat="l in ls"> <td>{{l.title}}</td> <td>{{l.comment}}</td> </tr> </tr> </table> --> <label>Data</label> <div ng-repeat="ls in lst"> <div ng-repeat="ll in ls"> <div>{{ll.title}} - {{ll.comment}} </div> </div> </div> </script> </body>
<!-- <body ng-app="geeksOnFire" onLoad="htmlExmample()"> <h1>Geeks on Fire</h1> HTML Version<br/> <div id="appNameId"></div> <br/> <div ng-controller="appNameController"> $scope Style<br/> <input ng-model="data.AppName"><br/> AppName = {{data.AppName}} </div> <br/> <app-name-component></app-name-component>
</body> -->
</html> <script src="js/index.js"></script>
</body>
</html>

Auth in firebase 3x - Script Codes CSS Codes

/* need to check whether user is logged in or not. using status. - done
2. if authenticated read and write data to /topics - done
3. get array list and populate as list - done
4. Add data specific to user. user can see only their data - done
5. Admin should see all users data - Pending
6. For Admin and User different view should come - Pending -- may be a role need to be implemented - Pending
-- UhmmzZtdmoud70BFm037V5HZl0k4HVTmHfGgd5qX --
*/

Auth in firebase 3x - Script Codes JS Codes

 var config = { apiKey: "AIzaSyDOpl-SHzKwMLXyt4yJCWIfZm7YhKB2y3M", authDomain: "ionicangular-8752e.firebaseapp.com", databaseURL: "https://ionicangular-8752e.firebaseio.com", storageBucket: "ionicangular-8752e.appspot.com", messagingSenderId: "974751062058" }; firebase.initializeApp(config);
var db = firebase.database();
// var fbAuth = $firebaseAuth();
var mapp = angular.module("MyApp", ['firebase','ngRoute']);
mapp.run(["$rootScope", "$location", function($rootScope, $location) {
$rootScope.$on("$routeChangeError", function(event, next, previous, 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") { $location.path("/"); }
});
}]);
mapp.factory("Auth", ["$firebaseAuth", function($firebaseAuth) { return $firebaseAuth(); }
]); mapp.controller("MainCtrl", HomeController); mapp.controller("ViewCtrl", ViewController); mapp.config(function($routeProvider){ $routeProvider .when('/',{ templateUrl:'home.htm', controller: 'MainCtrl' }) .when('/viewdata',{ templateUrl: 'viewData.htm', controller: 'ViewCtrl', resolve: { "currentAuth" : ["Auth",function(Auth){ return Auth.$requireSignIn(); }] } }) .otherwise({ redirectTo: '/' }); // $locationProvider.html5Mode(true); });
function HomeController($scope, $firebaseObject, $firebaseAuth, $firebaseArray){
$scope.fbAuth = $firebaseAuth();
$scope.err = {}; //var authData = fbAuth.$getAuth();
$scope.fbAuth.$onAuthStateChanged(function(firebaseUser) { if (firebaseUser) { console.log("Signed in as:", firebaseUser.uid); } else { console.log("Signed out"); $scope.btn_hide = true; }
}); $scope.logmein = function(username, password) { $scope.fbAuth.$signInWithEmailAndPassword( username, password ).then(function(authData) { $scope.err.message = "Successfully Logged in as " + authData.uid +" "+authData.providerId; $scope.btn_hide = false; }).catch(function(error) { $scope.err.message = "Error" + error; console.error("ERROR: " + error); $scope.btn_hide = true; }); }; $scope.regmein = function(username, password) { console.error("User Details: " + username + $scope.username); // username = "[email protected]"; $scope.fbAuth.$createUserWithEmailAndPassword( username, password ).then(function(authData) { $scope.err.message = "User registered "+authData.uid; }).catch(function(error) { $scope.err.message = "Error" + error; console.error("ERROR: " + error); }); }; $scope.logmeout = function() { $scope.fbAuth.$signOut(); $scope.err.message = "Logged Out"; $scope.btn_hide = true; }; $scope.deleteuser = function() { $scope.fbAuth.$deleteUser(); $scope.err.message = "User Deleted"; $scope.btn_hide = true; }; $scope.checkstatus = function(){ var authData = $scope.fbAuth.$getAuth(); if (authData) { $scope.err.message = "Logged in as: " + authData.uid +" "+ authData.email; $scope.btn_hide = false; } else { $scope.err.message = "Not Logged in!"; $scope.btn_hide = true; } };
// $scope.populate = function(){
// var ref = db.ref("/topics");
// syncObject = $firebaseObject(ref);
// syncObject.$bindTo($scope, "data");
// syncObject.$watch(function(info) {
// console.log("$scope: Data Changed on the Server", info);
// });
// }; $scope.populate = function(){ var authData = $scope.fbAuth.$getAuth(); if (authData){ var refPath = "/topics/"+authData.uid; so = $firebaseArray(db.ref(refPath)); so.$add({ title: $scope.title, comment: $scope.comment }).then(function(dat){ $scope.err.message = "Data uploaded"; }); } }; $scope.cusauth = function() { // e.preventDefault(); var sec = ''; var tokenGenerator = new FirebaseTokenGenerator(sec); var token = tokenGenerator.createToken({ uid: "5KuXbpGU2AP3zUYcP2PvcaoUQOT", role: "Admin", username: "[email protected]" }); console.log(token); // // var ref = new Firebase("https://ionicangular-8752e.firebaseio.com/");
// $scope.fbAuth.$signInWithCustomToken(token, function(authData) {
// if (authData) {
// console.log("Login Succeeded!", authData);
// } else {
// console.log("Login Failed!");
// }
// }); $scope.fbAuth.$signInWithCustomToken(token) .then(function(authData) { $scope.err.message = "User registered "+authData.uid; console.log("Custom Login success: " , authData); }).catch(function(error) { $scope.err.message = "Error" + error; console.error("ERROR: " + error); }); };
};
function ViewController($scope,$firebaseObject, $firebaseArray, Auth){ var aout = Auth.$getAuth(); if (aout){ var reff = '/topics/'+aout.uid; if (aout.email=='[email protected]'){ reff = '/topics/'; } $scope.lst = {}; $scope.lst = $firebaseArray(db.ref(reff)); $scope.lst.$loaded().then(function(object){ console.log(object); console.log(object.length);
}); }
};
Auth in firebase 3x - Script Codes
Auth in firebase 3x - Script Codes
Home Page Home
Developer Arun
Username arun_v606
Uploaded June 12, 2022
Rating 3
Size 4,603 Kb
Views 58,696
Do you need developer help for Auth in firebase 3x?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Arun (arun_v606) Script Codes
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!