कोणीय 2 बाल मार्गों के साथ प्रमाणीकरण

Question

मेरे पास एक कोणीय 2 एप्लिकेशन है जिसमें मुझे प्रत्येक पृष्ठ पर प्रमाणित करने की आवश्यकता है। तो मैंने पुष्टि करने के लिए एक कस्टम राउटरऑलेट लागू किया है कि मैं प्रत्येक पृष्ठ परिवर्तन पर लॉग इन हूं। http://plnkr.co/edit/YnQv7Mh9Lxc0l0dgAo7B?p=preview

वहाँ मार्ग परिवर्तन रोकना और प्रवेश के लिए अनुप्रेषित जब उपयोगकर्ता प्रमाणीकृत नहीं है करने के लिए एक बेहतर तरीका है:

@Directive({ 
    selector: 'auth-outlet' 
}) 
export class AuthOutlet extends RouterOutlet { 
    publicRoutes: any; 
    private parentRouter: Router; 
    private authService: AuthService; 
    constructor(_elementRef: ElementRef, 
       _loader: DynamicComponentLoader, 
       _parentRouter: Router, 
       @Attribute('name') nameAttr: string, 
       _authService: AuthService) { 

     super(_elementRef, _loader, _parentRouter, nameAttr); 
     this.parentRouter = _parentRouter; 
     this.authService = _authService; 
     this.publicRoutes = { 
      'Login': true 
     }; 
    } 

    activate(oldInstruction: ComponentInstruction) { 
     var url = this.parentRouter.lastNavigationAttempt; 
     console.log('attemping to nav'); 
     if (!this.publicRoutes[url] && !this.authService.loggedIn){ 
      var newInstruction = new ComponentInstruction('Login', [], new RouteData(), Login, false, 1); 
      return super.activate(newInstruction); 
     } else { 
      return super.activate(oldInstruction); 
     } 
    } 
} 

यहाँ एक काम कर कोड है?

Answer 1

किसी को भी यह पता चलता है कि, अब कोणीय 2 में जवाब नए राउटर के हिस्से के रूप में "गार्ड" का उपयोग करना है।

https://angular.io/docs/ts/latest/guide/router.html#!#guards

एक बुनियादी गार्ड सिर्फ "CanActivate" लागू करता है इस प्रकार है, और काम कर सकता था: देखें कोणीय 2 प्रलेखन

import {Injectable} from "@angular/core"; 
import {CanActivate, Router} from "@angular/router"; 
import {AuthService} from "../services/auth.service"; 

@Injectable() 
export class AuthGuard implements CanActivate { 
    constructor(private authService:AuthService, private router:Router){} 

    canActivate(){ 
     if(this.authService.isAuthenticated()) 
      return true; 

     this.router.navigate(["/login"]); 
     return false; 
    } 
} 

आप इस उदाहरण में देख सकते हैं मैं एक AuthService कहीं और चल रहा है (कार्यान्वयन महत्वपूर्ण नहीं है) जो उपयोगकर्ता को प्रमाणीकृत किया गया है, तो गार्ड को बता सकता है। यदि उनके पास है, तो सत्य वापस आएं और नेविगेशन सामान्य रूप से होता है। यदि वे नहीं हैं, तो हम झूठी वापसी करते हैं और उन्हें लॉगिन स्क्रीन पर रीडायरेक्ट करते हैं।

Answer 2

आप CanActivate का भी उपयोग कर सकते हैं, हालांकि इस समय प्रत्यक्ष DI समर्थित नहीं है। यहां एक अच्छा workaround था।

शुभकामनाएं।

Answer 3

यहां कोणीय 2 आरसी 6 के साथ ऑथगार्ड का उपयोग करने का एक अद्यतन उदाहरण है।

घर मार्ग के साथ मार्गों AuthGuard द्वारा संरक्षित

import { Routes, RouterModule } from '@angular/router'; 

import { LoginComponent } from './login/index'; 
import { HomeComponent } from './home/index'; 
import { AuthGuard } from './_guards/index'; 

const appRoutes: Routes = [ 
    { path: 'login', component: LoginComponent }, 

    // home route protected by auth guard 
    { path: '', component: HomeComponent, canActivate: [AuthGuard] }, 

    // otherwise redirect to home 
    { path: '**', redirectTo: '' } 
]; 

export const routing = RouterModule.forRoot(appRoutes); 

AuthGuard प्रवेश पृष्ठ पर यदि उपयोगकर्ता

import { Injectable } from '@angular/core'; 
import { Router, CanActivate } from '@angular/router'; 

@Injectable() 
export class AuthGuard implements CanActivate { 

    constructor(private router: Router) { } 

    canActivate() { 
     if (localStorage.getItem('currentUser')) { 
      // logged in so return true 
      return true; 
     } 

     // not logged in so redirect to login page 
     this.router.navigate(['/login']); 
     return false; 
    } 
} 

प्रवेश न होने पर पूर्ण उदाहरण के लिए और काम डेमो आप कर सकते हैं पुनर्निर्देश this post