Différence entre Angulaire du canLoad et canActivate?

Quelle est la différence entre canLoad et canActivate?

export interface Route {
  path?: string;
  pathMatch?: string;
  matcher?: UrlMatcher;
  component?: Type<any>;
  redirectTo?: string;
  outlet?: string;
  canActivate?: any[];
  canActivateChild?: any[];
  canDeactivate?: any[];
  canLoad?: any[];
  data?: Data;
  resolve?: ResolveData;
  children?: Routes;
  loadChildren?: LoadChildren;
}

Quand je devrais dont l'un d'eux?

OriginalL'auteur Yoav Schniederman | 2017-02-03

  1. 37

    canActivate est utilisé pour empêcher les utilisateurs non autorisés d'accéder à certaines routes. Voir les docs pour plus d'info.

    canLoad est utilisé pour empêcher l'application de chargement des modules entiers paresseusement si l'utilisateur n'est pas autorisé à le faire.

    Voir les docs et l'exemple ci-dessous pour plus d'info.

    {
    path: 'admin',
    loadChildren: 'app/admin/admin.module#AdminModule',
    canLoad: [AuthGuard]
},

    Avec ce code, le code de la AdminModule ne seront chargés dans l'application si AuthGuard retourne true.

    Si l'utilisateur n'est pas autorisé à accéder à cette voie, et nous avions utilisé un canActivate de la garde, le AdminModule serait chargé, même si l'utilisateur ne sera pas en mesure d'accéder à l'itinéraire.

    Si j'utilise canActivate dans le scénario ci-dessus, quelle sera la différence ?
    avec canActive module sera chargé (F12 > Sources - dans chrome). Vous pouvez voir .js fichiers.Avec canLoad ces modules (fichiers .js) ne sera pas chargé 🙂 Vérifier ma réponse ci-dessus où je vous l'ai expliqué mieux
    Quel est le scénario où l'Administrateur connecté, donc, l'administrateur module est chargé par canLoad retourne true et puis se déconnecte de l'application. Maintenant, un non-admin utilisateur se connecte dans le même navigateur, comment ça fonctionne? Le module chargé suis expulsé ou supprimés du cache?

    OriginalL'auteur Fredrik Lundin

  2. 6

    Quant à la question de commentaires dans d'autres post
    "Si j'utilise canActivate dans le scénario ci-dessus, quelle sera la différence ?"

    Fait pour l'utilisateur, il n'y aura pas de différence, il n'aura pas accès à la page dans les deux cas.
    Bien qu'il n'y a un caché différence. Si vous appuyez sur la touche F12 et de passer à des Sources (Chrome) où sont les fichiers de téléchargement.
    Ensuite, vous pouvez voir que dans le cas avec canActive fichier avec le code a été téléchargé (chunk.js). Même si vous n'avez pas accès à la page.
    Différence entre Angulaire du canLoad et canActivate?

    Mais dans ce cas avec canLoad il n'y aura pas chunk.js fichier avec le code source.

    Différence entre Angulaire du canLoad et canActivate?

    Donc, comme vous pouvez le voir, cette ont vraiment un grand impact pour la sécurité.

    Et bien sûr, n'oubliez pas que canLoad peut être utilisé que pour LazyLoaded Modules.

    incapable de voir tout fragment est pour les paresseux chargement d'un module dans mon onglet réseau, mais les itinéraires de travail comme prévu comment puis-je confirmer mon modules de chargement à la demande ou pas ?

    OriginalL'auteur DiPix

  3. 4

    canActivate est utilisé pour empêcher un utilisateur non autorisé

    canLoad est utilisé pour éviter que l'ensemble de module d'application

    Exemple de canActivate:

    { path: 'product',canActivate:[RouteGaurd], component : ProductComponent }

    Exemple de canLoad:

    { path: 'user' , canLoad: [AuthenticGuard], loadChildren : './user/user.module#UserModule' }

    OriginalL'auteur Sagar Jadhav