Javascript Electron JS：防止导航到特定路径名

发布于11月29日

当使用loadURL来加载我的网站时，我想防止用户导航到两个页面.我需要在Electron 应用程序中完成此操作.

例如，在我的应用程序中，我处于:

https://WebsiteApp.com

但我想阻止导航到该页面:

https://WebsiteApp.com/security

有什么方法可以阻止这条小路的航行吗？

pathname: '/security'

推荐答案

try 使用‘路由守卫’，它也被称为Navigation Guards，在某些框架中实现，如Angular 或Vue，在这种情况下使用Reaction路由和钩子来实现，包括TypeScrip.

无论如何，请查看this explanation，其中您可以根据身份验证级别等重定向页面，这是一个冗长的解释，但可能会对您有所帮助.

这个AuthGuard实现期望从AuthorizationService创建一个内部实例，以验证通过pageEnabled函数的访问.

// auth-guard.ts

import { Commands, Context, RedirectResult } from '@vaadin/router';
import { AuthorizationService } from './authorization-service';
import { PageEnabled } from './page-enabled';

export class AuthGuard implements PageEnabled {

  private authService: AuthorizationService;

  constructor() {
    this.authService = new AuthorizationService();
  }

  public async pageEnabled(context: Context, commands: Commands, pathRedirect?: string): Promise<RedirectResult | undefined> {
    const isAuthenticated = await this.authService.isAuthorized();

    if(!isAuthenticated) {
      console.warn('User not authorized', context.pathname);
     return commands.redirect(pathRedirect? pathRedirect: '/');
    }

    return undefined;
  }
}

此外，该类还需要实现定义的PageEnabled接口into /shared/auth/page-enabled.ts

//page-enabled.ts

import { Commands, Context, RedirectResult } from '@vaadin/router';

export interface PageEnabled {
  pageEnabled(
    context: Context,
    commands: Commands,
    pathRedirect?: string
  ): Promise<RedirectResult | undefined>;
}