javascript - 在 Angular 2 应用程序中注销之前获取最后一个事件 URL

标签 javascript angular typescript routes synchronous

在我的 Angular 2 应用程序中,我尝试将用户注销之前的最后一个事件 URL 存储起来,以便在用户重新登录后可以重新加载该 URL。但是,事实证明这是有问题的。考虑我的authenticationService 中的注销功能:

logout()
{
    let lastUrl = this.getActiveUrl();
    console.log('Url before logout: ', lastUrl);

    this.apiService.logout();
}

请注意“lastUrl”,它调用 this.getActiveUrl(),如下所示:

getActiveUrl()
{
    let activeUrl = this.router.routerState.snapshot['url'];
    console.log('activeUrl: ', activeUrl);
    return activeUrl;
}

...出现在 this.apiService.logout() 之前。但是,尽管如此,“lastUrl”打印到控制台的内容是“/login”。但这是我注销后立即到达的 URL。

所以,请帮助我理解这一点:

如果这是同步的,为什么这里不打印正确的 URL?我缺少什么?如何在注销触发并重定向到“/login”之前立即获取事件网址?

编辑:根据评论者的建议,我尝试分配给 localStorage 而不是局部变量,如下所示:

logout()
{
    localStorage.setItem('returnUrl', JSON.stringify(this.router.routerState.snapshot['url']));

    this.apiService.logout();
}

但是当我使用 localStorage.returnUrl 挖掘该值时,我仍然得到“/login”。

最佳答案

首先,非常感谢@Sam 的 localStorage 建议。我应该想到这一点。因此,最后,我需要做的就是利用 AuthGuardService 中的 canActivate() 函数中的 RouterStateSnapshot,并将该值保存到 localStorage。然后我只需检索该值以插入重新身份验证和重新登录:

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot)
    {

        // Get route content id
        let contentId = Object.getPropertyValueAtPath(route, 'data.contentId');

        // Store last active URL prior to logout, so user can be redirected on re-login
        localStorage.setItem('returnUrl', JSON.stringify(state.url));

        // DO OTHER STUFF...

    }

在我的登录组件中,我只是获取要传递的值...

login(response)
{
    this.loading = true;

    this.authenticationService.login(this.model.username, this.model.password, function (results)
    {
        if (results.data && results.ok === true)
        {
            this.returnUrl = JSON.parse(localStorage.getItem('returnUrl'));
            this.router.navigate([this.returnUrl || '/']);
            console.log('ReturnURL Value is: ', this.returnUrl);
            this.reset();
        }
        else
        {
            this.alertService.error(null, response);
            this.loading = false;
        }

    }.bind(this));
}

关于javascript - 在 Angular 2 应用程序中注销之前获取最后一个事件 URL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47104903/

相关文章:

javascript - 有没有一种遍历 Javascript 对象的所有子属性的好方法?

javascript - 通过 Javascript 调用 WCF 服务

javascript - 如何使用 setInterval 函数显示屏幕上出现的每个值之间间隔 500 毫秒的阶乘计算?

javascript - 如何在 javascript 中手动切换 Foundation 5 下拉菜单(在 emberjs 应用程序中)?

javascript - div 不滚动时获取回调

linux - Angular2 AOT ngtools/webpack 在 Linux 上失败

javascript - angular组件测试如何使用外部js库

javascript - 如何编写不带参数的类型化操作

TypeScript 在泛型扩展上的奇怪类型行为

node.js - 如何在 meteor 中使用 mongo 模式验证和 typescript ?