Angular 6授權

Question

如果用戶未登錄並嘗試訪問任何安全URL，則即使該用戶通過瀏覽器的URL欄直接訪問，也不應允許他訪問，並且必須重定向到登錄頁面。

我在這里找到了一個解決方案，它解決了我的問題，但是唯一的事情是，每當用戶嘗試從瀏覽器的URL欄訪問授權URL時，它都會呈現index.html和導航欄組件的內容。

Answer 1

您應該嘗試canActivate。 它將基於啟用路由來標識用戶已登錄。 以下是示例。 為以下創建ts文件。

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

@Injectable()
export class UserAuthorised implements CanActivate {

   constructor(private router: Router) { }

   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
      if (your condition here of if login true) {
         return true;
      } else {
         //redirect to login page.
         this.router.navigate(['/login']);
         return false;
      }
   }
}

將以上條目添加到app.module.ts文件中的提供程序列表中。 現在，您需要在路由文件中提供此類參考。

{ path: 'dashboard', component: DashboardComponent, canActivate: [UserAuthorised] },

上面的操作：如果用戶嘗試直接訪問url，則路由將返回false並將用戶重定向到登錄頁面。