Question

我正在使用用户身份验证开发Sencha Touch 2应用程序。

我使用令牌进行身份验证。

逻辑。

检查是本地存储中存在的令牌：

var tokenStore = Ext.getStore('TokenStore'),
token = tokenStore.getAt(0).get('token');

如果有令牌，请检查它是否有效。我正在从连接到我的API的模型中读取，该模型返回成功或失败 - 取决于令牌 - 如果它有效或无效。

 TestApp.model.CheckAuthModel.load(1, {
                scope: this,
                success: function(record) {
                  // Here, I know the token is valid

                },
                failure: function() {
                    console.log('failure');
                },
                callback: function(record) {
                    console.log('callback');
                    console.log();
                }
           });

这是路由器，它处理视图的逻辑：

Ext.define("TestApp.controller.Router", {

    extend: "Ext.app.Controller",

    config: {

        refs: {
            HomeView: 'HomeView',
            LoginView: 'LoginView',
            ProductsView: 'ProductsView',
            ProductsViewTwo: 'ProductsViewTwo'
        },

        routes: {
            '': 'home',
            'home' : 'home',
            'login' : 'login',
            'products' : 'products',
            'testingtwo' : 'testingtwo'
        }
    },

    home: function () {

        console.log('TestApp.controller.Router home function');

        var initialItem = Ext.Viewport.getActiveItem(),
            comp = this.getHomeView();

        if (comp === undefined) comp = Ext.create('TestApp.view.HomeView');

        Ext.Viewport.animateActiveItem(comp, {
            type: 'slide',
            listeners: {
                animationend: function() { 
                   initialItem.destroy();
                }
            }
        });
    },

    login: function () {

        var initialItem = Ext.Viewport.getActiveItem(),
            comp = this.getLoginView();

        if (comp === undefined) comp = Ext.create('TestApp.view.LoginView');

        Ext.Viewport.animateActiveItem(comp, {
            type: 'slide',
            listeners: {
                animationend: function() { 
                   initialItem.destroy();
                }
            }
        });
    },

    products: function () {

        var initialItem = Ext.Viewport.getActiveItem(),
            comp = this.getProductsView();

        if (comp === undefined) comp = Ext.create('TestApp.view.ProductsView');

        Ext.Viewport.animateActiveItem(comp, {
            type: 'slide',
            listeners: {
                animationend: function(){
                    initialItem.destroy();
                }
            }
        });
    },

    testingtwo: function () {

        var initialItem = Ext.Viewport.getActiveItem(),
            comp = this.getProductsViewTwo();

        if (comp === undefined) comp = Ext.create('TestApp.view.ProductsViewTwo');

        Ext.Viewport.animateActiveItem(comp, {
            type: 'slide',
            listeners: {
                animationend: function(){
                    initialItem.destroy();
                }
            }
        });
    },

    launch: function() {

        console.log('TestApp.controller.Router launch!');
    }
});

现在，如何将路由器与check auth模型回调链接？

我想知道应用程序到达路由器时的身份验证状态。

在其他MVC框架中，我可以在路由器之前进行过滤，检查auth并相应地处理路由。

我可以在Sencha Touch 2中这样做吗？

有什么想法吗？

Answer 1

您好我认为文档中的这一部分正是您所需要的：

之前
：对象
提供Controller函数的映射，以过滤从路由调度到它们之前运行的函数。这些通常用于在执行某个功能之前运行预处理功能，如身份验证。它们仅在从路线调度时被调用。用法示例：

Ext.define('MyApp.controller.Products', { config: { before: { editProduct: 'authenticate' }, routes: { 'product/edit/:id': 'editProduct' } }, //this is not directly because our before filter is called first editProduct: function() { //... performs the product editing logic }, //this is run before editProduct authenticate: function(action) { MyApp.authenticate({ success: function() { action.resume(); }, failure: function() { Ext.Msg.alert('Not Logged In', "You can't do that, you're not logged in"); } }); } });

http://docs.sencha.com/touch/2.3.1/#!/api/Ext.app.Controller-cfg-before

当然，您仍然需要决定是否应该每次都进行检查，或者应该暂时缓存身份验证结果。

已更新以回答以下评论 老实说，我不确定他们将如何在Sencha中声明静态方法Authenticate（你可以通过Javascript正常地做，我认为，即：原型）。

但还有其他更好的选择来解决Authenticate函数：

只需创建一个处理实用程序内容的单例类。 http://docs.sencha.com/touch/2.3.1/#!/api/Ext.Class-cfg-singleton

如果您真的想使用MyApp，可以在Ext.app.Application（在app.js中）中声明。然后从全局实例 MyApp.app.some_function（）中调用它。我不会完全推荐这种方法，因为你更改app.js，如果升级sencha touch，可能会带来问题。

Answer 2

您可以在应用程序的启动功能或auth控制器的init函数中实现auth check，并根据响应重定向到相应的url。像这样：

  TestApp.model.CheckAuthModel.load(1, {
            scope: this,
            success: function(record) {
               this.redirectTo("home/");

            },
            failure: function() {
                this.redirectTo("login/");
                console.log('failure');
            },
            callback: function(record) {
                console.log('callback');
                console.log();
            }
       });

Sencha Touch 2，在路由器上进行过滤之前，检查用户的身份验证状态

2 个答案: