Aurelia Router：授權子路由的良好模式

Question

我想授權子路由器上的路由，但是我對當前的解決方案並不滿意。 我當前的路線如下所示：

/
/account
/account/signin
/account/signout

為此，我定義了兩個路由器-帳戶頁面的根路由器和子路由器。 為了授權我的帳戶子路由器上的路由，我在根路由器配置中添加了以下管道步驟。

config.addAuthorizeStep({
    run: (instruction: NavigationInstruction, next: Next): Promise<any> => {
        if (!this.auth.isAuthenticated && (instruction.fragment === '/account' || instruction.fragment === '/account/profile')) {
            return next.cancel(new Redirect('account/signin'))
        }

        if (this.auth.isAuthenticated && instruction.fragment === '/account/signin') {
            return next.cancel(new Redirect('account'))
        }

        if (this.auth.isAuthenticated && instruction.fragment === '/account/signup') {
            return next.cancel(new Redirect('account'))
        }

        return next();
    }
})

它可以工作，但是我覺得必須有更好的方法...我真的很想完成以下任務：

1. 將授權邏輯移至帳戶子路由器。
2. 使用路由名稱代替片段，因為它似乎更可靠

Answer 1

您可以添加auth屬性以路由配置並檢查該配置

http://aurelia.io/docs/routing/configuration#pipelines

import {Redirect} from 'aurelia-router';

export class App {
  configureRouter(config) {
    config.addAuthorizeStep(AuthorizeStep);
    config.map([
      { route: ['', 'home'],       name: 'home',       moduleId: 'home/index' },
      { route: 'users',            name: 'users',      moduleId: 'users/index',  settings: { auth: true } },
      { route: 'users/:id/detail', name: 'userDetail', moduleId: 'users/detail', settings: { auth: true } }
    ]);
  }
}

class AuthorizeStep {
  run(navigationInstruction, next) {
    if (navigationInstruction.getAllInstructions().some(i => i.config.settings.auth)) {
      var isLoggedIn = // insert magic here;
      if (!isLoggedIn) {
        return next.cancel(new Redirect('login'));
      }
    }

    return next();
  }
}