Bagaimana menerapkan canActivate penjaga di semua rute?

Saya memiliki angular2 active guard yang menangani jika user tidak login di redirect ke halaman login:

import { Injectable } from  "@angular/core";
import { CanActivate , ActivatedRouteSnapshot, RouterStateSnapshot, Router} from "@angular/router";
import {Observable} from "rxjs";
import {TokenService} from "./token.service";

@Injectable()
export class AuthenticationGuard implements CanActivate {

    constructor (
        private router : Router,
        private token : TokenService
    ) { }

    /**
     * Check if the user is logged in before calling http
     *
     * @param route
     * @param state
     * @returns {boolean}
     */
    canActivate (
        route : ActivatedRouteSnapshot,
        state : RouterStateSnapshot
    ): Observable<boolean> | Promise<boolean> | boolean {
        if(this.token.isLoggedIn()){
            return true;
        }
        this.router.navigate(['/login'],{ queryParams: { returnUrl: state.url }});
        return;
    }
}

Aku harus menerapkannya pada setiap rute seperti :

const routes: Routes = [
    { path : '', component: UsersListComponent, canActivate:[AuthenticationGuard] },
    { path : 'add', component : AddComponent, canActivate:[AuthenticationGuard]},
    { path : ':id', component: UserShowComponent },
    { path : 'delete/:id', component : DeleteComponent, canActivate:[AuthenticationGuard] },
    { path : 'ban/:id', component : BanComponent, canActivate:[AuthenticationGuard] },
    { path : 'edit/:id', component : EditComponent, canActivate:[AuthenticationGuard] }
];

Apakah ada cara yang lebih baik untuk melaksanakan canActive pilihan tanpa menambahkannya ke setiap jalur.

Apa yang saya inginkan adalah untuk menambahkannya pada rute utama, dan itu harus berlaku untuk semua rute lainnya. Saya telah mencari banyak, tapi aku tidak bisa menemukan solusi yang berguna

Terima kasih

Rahul Kumar
Pertanyaan edit 19 April 2017 в 6:23
Pemrograman
angular typescript angular-routing
19 April 2017 в 6:16
1 tampilan
Larutan

Anda dapat memperkenalkan componentless orang tua rute dan menerapkan penjaga di sana:

const routes: Routes = [
    {path: '', canActivate:[AuthenticationGuard], children: [
      { path : '', component: UsersListComponent },
      { path : 'add', component : AddComponent},
      { path : ':id', component: UserShowComponent },
      { path : 'delete/:id', component : DeleteComponent },
      { path : 'ban/:id', component : BanComponent },
      { path : 'edit/:id', component : EditComponent }
    ]}
];
Komentar (10)

Anda juga dapat berlangganan ke router's perubahan rute dalam aplikasi anda.komponen's ngOnInit fungsi dan memeriksa otentikasi dari sana misalnya

    this.router.events.subscribe(event => {
        if (event instanceof NavigationStart && !this.token.isLoggedIn()) {
            this.router.navigate(['/login'],{ queryParams: { returnUrl: state.url}}); 
        }
    });

Saya lebih suka cara ini lakukan setiap jenis aplikasi yang luas cek(s) ketika perubahan rute.

Komentar (0)

Saya pikir anda harus menerapkan "anak routing" yang memungkinkan anda untuk memiliki orang tua (dengan jalan "admin" misalnya) dan anak-anaknya.

Kemudian anda dapat menerapkan canactivate untuk orang tua yang secara otomatis akan membatasi akses ke semua anaknya. Sebagai contoh jika saya ingin mengakses "admin/home" aku'akan perlu untuk pergi melalui "admin" yang protectected oleh canActivate. Anda bahkan dapat menentukan orang tua dengan kosong jalan "," jika anda ingin

Komentar (0)

Saya datang di ini contoh ketika mencari dan tertangkap oleh contoh yang diberikan dalam contoh.

Anda perlu memastikan bahwa penjaga mengembalikan true jika anda ingin menunjukkan anak rute. 

@Injectable()
export class AuthenticationGuard implements CanActivate {

    constructor(
        private router: Router,
        private authService: AuthService) { }

    canActivate(
        route: ActivatedRouteSnapshot,
        state: RouterStateSnapshot
    ): Observable | Promise | boolean {

        // Auth checking code here

        // Make sure you return true here if you want to show child routes
        return true;
    }
}
Komentar (0)