Sencha Touch JsonP 回调无法识别 Ext 对象

Posted 2023-02-26

【中文标题】Sencha Touch JsonP 回调无法识别 Ext 对象

【英文标题】：Sencha Touch JsonP Callback doesn't recognise Ext object

【发布时间】：2015-01-18 03:21:08

【问题描述】：

我正在通过以下方式使用 Sencha Touch 的 Ext.data.JsonP.request 调用：

Ext.data.JsonP.request(
    url: 'php/apiCustomer.php',
    callbackKey: 'callback',
    scope: this,
    params: 
        action:   'AttemptLogin',
        email:    name,
        password: password,
        format:   'json'
    ,
    success: function(result, request) 
        // ...
    
);

响应如下所示：

Ext.data.JsonP.callback1(...)

在正常情况下，这完全正确。但是，在运行构建的生产代码时，出现以下错误：

Uncaught TypeError: Cannot read property 'JsonP' of undefined

我自己进行了调查，发现在评估回调时，这就是“Ext”对象的所有已知信息：

Ext.blink
Ext.microloaded
Ext.filterPlatform

有人遇到过这种情况吗？

编辑：

我的 app.json 文件的内容是：

    /**
     * The application's namespace, used by Sencha Command to generate classes
     */
    "name": "MyApp",

    /**
     * The file path to this application's front html document, relative to this app.json file
     */
    "indexHtmlPath": "index.html",

    /**
     * The absolute URL to this application in development environment, i.e: the URL to run this application
     * on your web browser during development, e.g: "http://localhost/myapp/index.html".
     *
     * This value is needed when build to resolve your application's dependencies if it requires server-side resources
     * that are not accessible via file system protocol.
     */
    "url": null,

    /**
     * List of all javascript assets in the right execution order.
     * Each item is an object with the following format:
     *      
     *          "path": "path/to/script.js" // Path to file, if local file it must be relative to this app.json file
     *          "remote": true              // (Optional)
     *                                      // - Defaults to undefined (falsey) to signal a local file which will be copied
     *                                      // - Specify true if this file is a remote file which will not to be copied
     *          "update": "delta"           // (Optional)
     *                                      //  - If not specified, this file will only be loaded once, and
     *                                      //    cached inside localStorage until this value is changed.
     *                                      //  - "delta" to enable over-the-air delta update for this file
     *                                      //  - "full" means full update will be made when this file changes
     *          "x-bootstrap": true         // (Optional)
     *                                      // Indicates a development mode only dependency.  
     *                                      // These files will not be copied into the build directory or referenced
     *                                      // in the generate app.json manifest for the micro loader.
     *
     *      
     */
    "js": [
        
            "path": "touch/sencha-touch.js",
            "x-bootstrap": true
        ,
        
            "path": "bootstrap.js",
            "x-bootstrap": true
        ,
        
            "path": "app.js",
            "bundle": true,  /* Indicates that all class dependencies are concatenated into this file when build */
            "update": "delta"
        
    ],

    /**
     * List of all CSS assets in the right inclusion order.
     * Each item is an object with the following format:
     *      
     *          "path": "path/to/item.css" // Path to file, if local file it must be relative to this app.json file
     *          "remote": true             // (Optional)
     *                                     // - Defaults to undefined (falsey) to signal a local file which will be copied
     *                                     // - Specify true if this file is a remote file which will not to be copied
     *          "update": "delta"          // (Optional)
     *                                     //  - If not specified, this file will only be loaded once, and
     *                                     //    cached inside localStorage until this value is changed to either one below
     *                                     //  - "delta" to enable over-the-air delta update for this file
     *                                     //  - "full" means full update will be made when this file changes
     *
     *      
     */
    "css": [
        
            "path": "resources/css/app.css",
            "update": "delta"
        ,
        
            "path": "resources/css/custom.css",
            "update": "delta"
        
    ],

    /**
     * Used to automatically generate cache.manifest (HTML 5 application cache manifest) file when you build
     */
    "appCache": 
        /**
         * List of items in the CACHE MANIFEST section
         */
        "cache": [
            "index.html"
        ],
        /**
         * List of items in the NETWORK section
         */
        "network": [
            "*"
        ],
        /**
         * List of items in the FALLBACK section
         */
        "fallback": []
    ,

    /**
     * Extra resources to be copied along when build
     */
    "resources": [
        "resources/images",
        "resources/icons",
        "resources/startup"
    ],

    /**
     * File / directory name matchers to ignore when copying to the builds, must be valid regular expressions
     */
    "ignore": [
        "\.svn$"
    ],

    /**
     * Directory path to store all previous production builds. Note that the content generated inside this directory
     * must be kept intact for proper generation of deltas between updates
     */
    "archivePath": "archive",

    /**
     * List of package names to require for the cmd build process
     */
    "requires": [
    ],

    /**
     * Uniquely generated id for this application, used as prefix for localStorage keys.
     * Normally you should never change this value.
     */
    "id": "52d77512-9617-4982-b007-98bfaed1312e"

index.html的内容是：

<!DOCTYPE HTML>
<html manifest="" lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>MyApp</title>
    <link rel="apple-touch-icon" href="icon.png" />
    <style type="text/css">
         /**
         * Example of an initial loading indicator.
         * It is recommended to keep this as minimal as possible to provide instant feedback
         * while other resources are still being loaded for the first time
         */
        html, body 
            height: 100%;
            background-color: #DB3040
        

        #appLoadingIndicator 
            position: absolute;
            top: 50%;
            margin-top: -15px;
            text-align: center;
            width: 100%;
            height: 30px;
            -webkit-animation-name: appLoadingIndicator;
            -webkit-animation-duration: 0.5s;
            -webkit-animation-iteration-count: infinite;
            -webkit-animation-direction: linear;
        

        #appLoadingIndicator > * 
            background-color: #FFFFFF;
            display: inline-block;
            height: 30px;
            -webkit-border-radius: 15px;
            margin: 0 5px;
            width: 30px;
            opacity: 0.8;
        

        @-webkit-keyframes appLoadingIndicator
            0% 
                opacity: 0.8
            
            50% 
                opacity: 0
            
            100% 
                opacity: 0.8
            
        
    </style>
    <!-- The line below must be kept intact for Sencha Command to build your application -->
    <script id="microloader" type="text/javascript" src=".sencha/app/microloader/development.js"></script>
</head>
<body>
    <div id="appLoadingIndicator">
        <div></div>
        <div></div>
        <div></div>
    </div>
</body>
</html>

【问题讨论】：

错误提示Ext.data包未定义。您是如何构建生产代码的？

你的 App.json 文件的内容是什么？

已添加到问题中。

ok - 一切正常，index.html 的内容呢

已添加。感谢您在这方面与我合作。

【参考方案1】：

事实证明，问题在于Ext 对象不在全局范围内，因此在回调代码中不可见。为了解决这个问题，我通过以下方式修改了缩小的 app.js 代码：

在文件开头添加了“MyApp=null;”， 将“var MyApp=MyApp||()”替换为“MyApp=MyApp||()”。 将“var Ext=Ext||()”替换为“Ext=Ext||()”。

这将正确的东西放在全局命名空间中。