6

मैं वर्तमान में रूटिंग का उपयोग करने की कोशिश कर रहा हूं, ताकि उपयोगकर्ता को किसी निश्चित पृष्ठ पर रीडायरेक्ट किया जा सके, यदि वे प्रमाणीकृत नहीं हैं, और यदि वे प्रमाणीकृत हैं तो किसी अन्य पृष्ठ पर रीडायरेक्ट करते हैं।AngularFire का उपयोग कर फायरबेस में उपयोगकर्ता प्रमाणीकरण के साथ रूटिंग का उपयोग कैसे करें?

नीचे एचटीएमएल

<html ng-app="sampleApp"> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script> 
    <script src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script> 
    <script src="https://cdn.firebase.com/libs/angularfire/0.9.1/angularfire.min.js"></script> 
    <script src="app.js"></script> 
    </head> 
    <body ng-controller="SampleCtrl"> 
    <div ng-show="user"> 
     <p>Hello, {{ user.facebook.displayName }}</p> 
     <button ng-click="auth.$unauth()">Logout</button> 
    </div> 
    <div ng-hide="user"> 
     <p>Welcome, please log in.</p> 
     <button ng-click="auth.$authWithOAuthPopup('facebook')">Login</button> 
    </div> 
    </body> 
</html> 

है नीचे आवेदन, ऊपर

var app = angular.module("sampleApp", ["firebase"]); 

//Generates the $firebaseAuth instance 
app.factory("Auth", ["$firebaseAuth", function($firebaseAuth) { 
    var ref = new Firebase("https://crowdfluttr.firebaseio.com/"); 
    return $firebaseAuth(ref); 
}]); 

//auth is now used in controller 
app.controller("SampleCtrl", ["$scope", "Auth", function($scope, Auth) { 
    $scope.auth = Auth; 
    $scope.user = $scope.auth.$getAuth(); 
}]) 

//redirects to homepage if $requireAuth rejects 
app.run(["$rootScope", "$location", function($rootScope, $location) { 
    $rootScope.$on("$routeChangeError", function(event, next, previous, error) { 
    if (error === "AUTH_REQUIRED") { 
     $location.path("/home"); 
    } 
    }); 
}]); 

//use routeProvider to only load HomeCtrl if $waitroAuth Resolves and returns promise 
app.config(["$routeProvider", function($routeProvider) { 
    $routeProvider.when("/home", { 
    controller: "HomeCtrl", 
    templateUrl: "views/home.html", 
    resolve: { 
     "currentAuth": ["Auth", function(Auth) { 
     return Auth.$waitForAuth(); 
     }] 
    } 
    }).when("/account", { 
    //controller only loaded if $requireAuth resolves 
    controller: "AccountCtrl", 
    templateUrl: "views/account.html", 
    resolve: { 
     "currentAuth": ["Auth", function(Auth) { 
     return Auth.$requireAuth(); 
     }] 
    } 
    }); 
}]); 

//returns the authenticated user from currentAuth or null if not logged in 
app.controller("HomeCtrl", ["currentAuth", function(currentAuth) { 
}]); 

app.controller("AccountCtrl", ["currentAuth", function(currentAuth) { 
}]); 

मेरे एप्लिकेशन में कुछ है मतलब नहीं है तो किसी दूसरे पृष्ठ पर एक उपयोगकर्ता रीडायरेक्ट करने के लिए एक बार वे प्रमाणीकृत हैं या अगर वे प्रमाणित नहीं हैं तो किसी अन्य पृष्ठ पर रीडायरेक्ट करें।

मेरी codepen के लिए यहाँ देखें: http://codepen.io/chriscruz/pen/ogWyLJ

इसके अलावा, यहां मैं कहाँ लागू करने के लिए से कोशिश कर रहा हूँ संदर्भ के लिए एक पेज है: https://www.firebase.com/docs/web/libraries/angular/guide.html#section-routes

उत्तर

4

आपका समाधान काफी सरल है, ngRoute लाइब्रेरी इस प्रकार में शामिल हैं:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.10/angular-route.min.js"></script> 

अपने एचटीएमएल हेड में।

फिर भी ngRoute आप में एक निर्भरता के रूप में एप्लिकेशन, इस प्रकार में शामिल हैं: codepen पर समाधान पर

var app = angular.module("sampleApp", ["firebase", "ngRoute"]); 

दृश्य: http://codepen.io/christiannwamba/pen/jEmegY भी

गुडलक और सादर

संबंधित मुद्दे

 संबंधित मुद्दे