extjs部署 - 文件加载的顺序

时间:2013-10-30 15:44:46

标签: ajax extjs extjs4 web-deployment

我已经到达了我的extjs网络应用程序已准备好部署的阶段,并且使用sencha CMD我创建了jsb文件,我用它创建了all-classes.js和all-app.js。但是当我试图运行已部署的版本时它失败了 - 我理解为什么,但我不知道如何解决它。 你看,应用程序的app.js文件看起来像这样;

var SessionData = null;
var Proxy = null;    

Ext.Ajax.on('requestexception', function (conn, response) {
    if (response.status === 401) {
        window.location.href = "../login/index.html";
    }
    if (response.status === 403) {
        var data = Ext.decode(response.responseText);
        Ext.MessageBox.alert('Error', data.error);
    }
});
....
Ext.Ajax.request({
    url :'/LPAA/Servlets/servlet/LPA',
    method: 'GET',
    params: {
        action: App.Actions.UserManagement.VALIDATE,
        lpCode: getJsonFromUrl().lpParentCode
    },
    scope: this,
    success: onValidateSession,
    failure: function(){
        window.location.href = "../login/index.html";
    }
});
....
function onValidateSession(response){
    SessionData = Ext.decode(response.responseText);
    if (SessionData == null || SessionData.userName == null){
        window.location.href = "../login/index.html";
        return;
    }
    Proxy = {
        type: 'ajax',
        url :'/LPAA/Servlets/servlet/LPA',
        timeout:120000,
        reader: {
            root: "array",
            type: 'json'
        },
        writer: {
            type: 'json'
        }
    };
    Ext.Loader.setConfig({
        enabled: true,
        disableCaching: false // this prevents break-points in Chrome's debugger to     disappear after reloading the page
    });

    Ext.application({
        requires: [...],
        models: [...],
        stores: [...],
        views: [...],
        controllers: [...],
        name: 'LPAClient',
        launch: function () {
            globalApp = this;
            Ext.create('Ext.container.Viewport', {
                layout: 'fit',
                items: [
                    {
                        xtype: 'entitlement'
                   }
               ]
            });
            try {
                Ext.create('LPAClient.GeneralUtils');
            } catch (ex){}
        }
    });
}

重点是首先通过服务器验证会话,并且只有在构造了应用程序的有效时才会验证。现在,当我运行应用程序时,我在浏览器控制台中遇到的错误是

Uncaught TypeError: Cannot call method 'on' of undefined 

哪个来源位于代码开头的Ext.Ajax.on('requestexception'...中。我可以在网络选项卡中看到app-all.js在Ajax.js文件之前加载。 如何在加载all-app.js文件之前强制我的应用程序加载Ajax.js文件?或者换句话说 - 我怎么能让app.js在使用它之前需要'Ext.Ajax'?

欢呼声, 埃雷兹

1 个答案:

答案 0 :(得分:0)

您的代码的第一个问题是您不应该在应用程序之外运行ExtJS代码。将会话验证码放入应用程序的launch方法中。这与ExtJs中新的MVC范例更为一致。

关于sencha cmd: Sencha cmd版本4知道您的应用使用的所有javascript文件,并且您不再需要维护jsb文件。阅读introduction to Sencha Cmd herecomplete Sencha Command 4.0 docs

编译应用程序的jsb3方法与Sencha Command 3.0一起使用,并且在版本4.0中用于向后兼容性原因,但不建议这样做。你提到的参考已经超过两年,现在已经过时,因为它是在Sencha cmd 4.0发布之前编写的。

我无法解释如何将项目迁移到ExtJs的新思维方式。涉及的步骤是盲目的:

  • 确保每个JS文件只包含一个类定义,并且它位于与其包含的类名对应的路径中。
  • 根据recommendations

    查看文件夹结构

    应用程序/     模型/     商店/     控制器/     视图/     的application.js 的index.html app.js