在Ember.js中重新导航到当前路由

Renavigating to current route in Ember.js

本文关键字:导航 路由 js Ember 新导航      更新时间:2023-09-26

所以在身份验证和转换方面似乎有一个既定的模式。

在转换检查认证->会话过期->存储尝试转换->重定向到登录->成功登录->重试尝试转换

这个我们已经实现了,它工作得很好。现在我们想知道当一个动作包含例如一个rest调用,其中身份验证失败,由于过期的会话怎么办?这里我们希望重定向到login,但问题是如何回到应用程序之前的位置?存储routeName是不够的,因为可能存在动态段。是否有任何烬对象在后台存储当前路由包括url参数?

好的,所以为了庆祝我找到了我记得以前搜索过的Transition源代码,我继续在我正在开发的Ember应用程序中为您测试了这一点。它的简短和甜蜜的是是的,你可以retry()一个存储的转换在任何时候,因此我的建议是始终存储最新的转换,然后retry它在必要时,在你的会话过期的情况下。好吧,不管怎样,最新的有用的转换,你的转换到登录路由等当然应该被忽略。

你甚至可以使用一个类似的相对快速的安排,就像我刚才所做的。在我的应用程序路由routes/application.js中,我添加了以下操作处理程序

actions: {
    willTransition: function(transition) {
        this.set('_latestTransition', transition);
    },
    saveTransition: function() {
        var transition = this.get('_latestTransition');
        console.log('transition saved', transition);
        this.set('_transitionSnapshot', transition);
    },
    retryTransition: function() {
        var transition = this.get('_transitionSnapshot');
        console.log('transition retry', transition);
        transition.retry();
    }
}

然后,对于我的测试,我只是在一个始终可见的菜单中添加了两个按钮:一个用于触发saveTransition动作,另一个用于触发retryTransition动作。结果是,在点击保存按钮,之后做了几个其他的转换,然后点击重试按钮后,我回到了第一次点击保存按钮时的页面。动态段很好;我在任何地方都没有使用查询参数,所以测试这些参数对我来说不够快,但是Transition对象显然也包含这些参数。

由于这些操作处理程序驻留在应用程序路由中,只要应用程序中没有其他东西以这些名称处理操作(或者特别是在willTransition的情况下,操作通过返回true而冒泡),它们将在这里处理。如前所述,您可以自己使用这种方法,或者根据您的需要和注释中的建议使用一些服务中介来存储必要的转换。

看看这个指南。特别是"存储和重试转换"部分,这是你需要的。

编辑:

如果你在寻找一个会话服务的实现,看看ember-simple-auth的会话服务。

我假设您正在使用ember-simple-auth。在这种情况下,尝试在应用程序路由中添加以下代码:

actions: {
    error: function (error, transition) {
        /**
         * Handle 401 error during model hook
         */
        if (error.errors !== undefined) {
            for (var i = 0; i < error.errors.length; i++) {
                if (error.errors[i].status !== undefined) {
                    if (parseInt(error.errors[i].status) === 401) {
                        transition.abort();
                        this.set('session.attemptedTransition', transition);
                        this.transitionTo('login');
                        return false;
                    }
                }
            }
        }
        return true;
    }
}

这个重要的行this.set('session.attemptedTransition', transition);我从authenticated-route-mixin。