Как я могу запретить Angular 6 Custom-Reuse-Strategy кэшировать запрещенную страницу 403?

Question

Надеюсь, что кто-то может помочь мне в этом вопросе.

При кодировании приложения Angular 6, я использую Custom-Reuse-Strategy для кэширования страниц, на которых был пользователь, а также HttpInterceptor для обработки 401/403.введите запросы.

Моя проблема заключается в том, когда применяется этот набор условий:

1. Пользователь нажимает на ссылку, например, на / blogs
2. Запрос http:сделано для моего контроллера dotnet webapi, который проверяет роли пользователей, например, «Автор».Контроллер идентифицирует этого пользователя как не имеющего роль «Автор», поэтому он возвращает код состояния 403. (запрещено).
3. Компонент-перехватчик получает это состояние 403 и перенаправляет пользователя на «запрещенную» страницу..

Однако все это прекрасно работает

Даже если перехватчик подхватывает 403 и выполняет перенаправление, компонент стратегии повторного использования по-прежнему кэширует страницу / blogs в свой массив.кэшированных страниц.Таким образом, когда пользователь щелкает ссылку, чтобы снова перейти к маршруту / blogs, кэш запускается и предоставляет страницу пользователю, и поскольку на этот раз не выполняется http-запрос из-за его извлечения из кэша повторного использования, 403 запрещаетсяне перехватывается в перехватчике, поэтому пользователю показывается половина страницы блогов / блогов (без данных, так как webapi не возвращает никаких данных).

Есть ли способ предотвратить эту страницу / блоги?помещается в кэш повторного использования, когда он находится в состоянии запрета 403?

Я пытался заглянуть в кэш повторного использования непосредственно перед тем, как перенаправить на запрещенную страницу в перехватчике, но в этот момент кэш не имеетпункт / блоги.Он должен быть добавлен после того, как перехватчик завершил свою работу.

Я понимаю, что ссылку можно скрыть, если у пользователя нет роли, но ради аргументов, скажем, ссылка видна даже без правильной роли.

Итак, я могу предотвратить его попадание в кеш или как-то удалить его из кеша, основываясь на перехватчике.

Надеюсь, кто-то может посоветовать.

Спасибо.

custom-reuse-стратегии.ts

    import { RouteReuseStrategy, DetachedRouteHandle, ActivatedRouteSnapshot } from "@angular/router";
    import { SignInComponent } from "./user/sign-in/sign-in.component";


    export class CustomReuseStrategy implements RouteReuseStrategy { 

    private handlers: {[key: string]: DetachedRouteHandle} = {};

    private cachedUrls = [
        /home/
      ]

    constructor() {}

    shouldDetach(route: ActivatedRouteSnapshot): boolean {
      return true;
    }

    store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
      let url = route.url.join("/") || route.parent.url.join("/");
      //Don't cache the following urls...
      if(url.startsWith('member/view/') || url.startsWith('post/') || url === "home"){
        return;
      }
      this.handlers[url] = handle; 
    }

    shouldAttach(route: ActivatedRouteSnapshot): boolean {
        let url = route.url.join("/") || route.parent.url.join("/");
        //Logout - remove all cached routes
        if (route.component == SignInComponent) {
          this.handlers = {};
          return false;
        }

        //If this route is cached - load up the cached information
        for (let preservedUrl of this.cachedUrls) {
            if (preservedUrl.test(url)) {
              return false;
            }
        }
        return !!this.handlers[url];    
    }

    retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
      return this.handlers[route.url.join("/") || route.parent.url.join("/")];    
    }

    shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
      return future.routeConfig === curr.routeConfig;
    }


   }

auth.interceptor.ts

    import { HttpInterceptor, HttpRequest, HttpHandler, HttpUserEvent, HttpEvent } from "@angular/common/http";
    import { Observable } from "rxjs";
    import { tap } from 'rxjs/operators';
    import { Injectable } from "@angular/core";
    import { Router } from "@angular/router";


    @Injectable()
    export class AuthInterceptor implements HttpInterceptor {

        constructor(private router: Router) { }

        intercept(req: HttpRequest, next: HttpHandler): Observable> {
            if (req.headers.get('No-Auth') == "True")
            {
                return next.handle(req.clone());
            }

            if (localStorage.getItem('userToken') != null) {
                const clonedreq = req.clone({
                    headers: req.headers.set("Authorization", "Bearer " + localStorage.getItem('userToken'))
                });

                return next.handle(clonedreq).pipe
                (
                    tap(
                        succ => { },
                        err => {
                            if (err.status === 401){
                                localStorage.removeItem('userToken');
                                this.router.navigateByUrl('/account/login');
                            }
                            else if (err.status === 403){
                                this.router.navigateByUrl('/forbidden');
                            }
                        }
                    )
                );
            }
            else {
                this.router.navigateByUrl('/account/login');
            }
        }
    }