Sencha Touch JsonP 回调无法识别 Ext 对象
Sencha Touch JsonP Callback doesn't recognise Ext object
我正在按以下方式使用 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
对象不在全局范围内,因此在回调代码中不可见。为了修复它,我通过以下方式修改了缩小的 app.js 代码:
- 在文件开头添加了“
MyApp=null;
”,
- 已将“
var MyApp=MyApp||()
”替换为“MyApp=MyApp||()
”。
- 已将“
var Ext=Ext||()
”替换为“Ext=Ext||()
”。
这在全局命名空间中放置了正确的东西。
我正在按以下方式使用 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
对象不在全局范围内,因此在回调代码中不可见。为了修复它,我通过以下方式修改了缩小的 app.js 代码:
- 在文件开头添加了“
MyApp=null;
”, - 已将“
var MyApp=MyApp||()
”替换为“MyApp=MyApp||()
”。 - 已将“
var Ext=Ext||()
”替换为“Ext=Ext||()
”。
这在全局命名空间中放置了正确的东西。