在组件中处理具有特定功能的请求

【问题标题】：Handle a request with a specific function in a component在组件中处理具有特定功能的请求
【发布时间】：2016-12-04 12:31:03
【问题描述】：

我们正在开发一个处理 OpenID Connect 隐式流的组件。

在step 5 of the flow 中，“授权服务器使用 ID 令牌和访问令牌（如果请求）将最终用户发送回客户端。”我们希望我们的组件处理该请求，该请求将发送至~/openid-login。

我们如何配置 Aurelia 让它路由到我们组件中的函数？

export class OpenId {

    // how do we route ~/openid-login to this?
    public handleRequest() {

    }

}

注意：Here is the work in progress.

【问题讨论】：

标签： aurelia

【解决方案1】：

在您的 routeConfig 中使用 navStrategy 将允许您在导航到页面之前做任何您想做的事情。见下文：

import { autoinject } from 'aurelia-framework';
import { RouterConfiguration, Router, NavigationInstruction } from 'aurelia-router';

@autoinject
export class App {

    router: Router;

    configureRouter(config: RouterConfiguration, router: Router) {

        let openIdNavStrat = (instruction: NavigationInstruction) => {

            console.log('Do whatever we would like to do.');

            // then redirect to where ever you would like.
            instruction.config.moduleId = 'login';
        }

        config.map([
            { route: ['', 'login'], moduleId: 'login' },
            { route: 'openid-login', navigationStrategy: openIdNavStrat },
        ]);

        this.router = router;
    }
}

这里有关于导航策略的文档：http://aurelia.io/hub.html#/doc/article/aurelia/router/latest/router-configuration/3

【讨论】：

这是否还要求我们有一个 app.html 视图，其中包含一个路由器视图？