Question

我正在使用sencha架构师编写一个sencha touch应用程序。因为我的应用程序执行了很多ajax请求，所以大多数需要在请求标头中发送'token'进行身份验证。所以我想创建基于Ext.Ajax的子类，它在请求头中总是有'token'。然后我可以使用这个子类而无需关注标题。

MyApp.override.Ajax.request({ ... })

我尝试在app / override / Ajax.js中定义它

Ext.define('Myapp.override.Ajax', {
  override: 'Ext.Ajax',
  headers: {
      'token': 'test'
  }
});

我还在Application中将其设置为'requires'。但是在尝试调用

时会出错

Myapp.override.Ajax.request({ ... })

似乎Myapp找不到.override包（MyApp.override是unifined）

如何让MyApp知道覆盖包，或者正确/最好的方法是什么。

非常感谢一个简单的例子。非常感谢你。

更新信息：

覆盖文件位置：app \ override \ Ajax.js

html文件：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script>
    var Ext = Ext || {};
    Ext.theme = {
        name: "Default"
    };
</script>
<script src="sencha-touch-all-debug.js"></script>
<link rel="stylesheet" href="resources/css/sencha-touch.css">
<script src="app/override/Ajax.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>
<body></body>
</html>

app.js文件

Ext.Loader.setConfig({

});

Ext.application({

requires: [
    'MyApp.override.Ajax'
],
views: [
    'ContactDetailView'
],
name: 'MyApp'
...

应用程序可以正常启动但是在调用MyApp.override.Ajax.request时：无法读取未定义的属性“Ajax”，表示MyApp.override未定义

更新

这里有新闻，它更好但尚未奏效。

Ext.define('MyApp.Ajax', {
extend: 'Ext.data.Connection',
singleton: true,

request: function( options ) {
    this.constructor(options, options.url);
console.log(options);
    options.header = {'Token':'mytoken'};
    this.callParent( options );
}
});

尝试MyApp.Ajax.request（）时出现错误

。我确定options.url存在于选项中，方法是检查日志

[ERROR][Ext.data.Connection#request] No URL specified

我从构造函数

添加extend

constructor : function (config, url)
{
    config = config || {};
//config.url = 'google.com';
    this.initConfig(config);
    this.callParent(config);
},

当我从config.url ='google.com'中移除评论时，错误就消失了;但它来了config.url有ajax请求网址但本地文件网址???我从chrome控制台和网络看到了什么？

GET file:///C:/MyApp/assets/www/google.com?_dc=1370855149720

请帮忙。感谢。

Answer 1

您似乎不同意自己的覆盖类名称：

Myapp.override.Ajax
Lunex.override.Ajax
Myapp.override.data.proxy.Ajax

是哪一个？注意这一点，装载机不会轻易做到......

无论如何，您似乎对override和extend感到有些困惑。

extend会根据您指定的修改从父类创建一个新类。然后你可以使用你定义的类，就像你想要的那样。

另一方面，

override将修改应用于现有类。在这种情况下，类名仅用于require语句和加载器。没有创建实际的类。因此，在您的示例中，未定义名称空间MyApp.override，因此错误。但是，无论何时使用Ext.Ajax，都应发送自定义标头。如果你是经理加载你的文件，那就是; p

现在，您的情况有点特殊，因为Ext.Ajax是Ext.data.Connection的单身实例。看到它的code，那里并不多。虽然覆盖一个单身人士是有道理的，但从中延伸会令人不安。

所以，你可能想要做的是：

Ext.define('Myapp.Ajax', {
    extend: 'Ext.data.Connection',
    headers: {
        'token': 'test'
    }
});

这样你就可以：

Myapp.Ajax.request({ ... });

这里的最佳选择是覆盖还是延伸是一个棘手的问题。我很高兴你没有问过它！

Answer 2

最后，这是我的工作

Ext.define('MyApp.Ajax', {    
    extend: 'Ext.data.Connection',

    singleton: true,

    request: function( options ) {
        options.headers = {
            Token: 'mytoken',
        };
        this.callParent( [options] );
    }
});

这就是我想做的事情，很棒。

Ext.Ajax.on('beforerequest', (function(conn, options, eOpts) {  
    options.headers = {
        Token: 'mytoken',
    };
}), this);

Answer 3

为什么不在扩展类中使用配置'defaultHeaders'？这样，它总是被添加到标题中。

http://docs-origin.sencha.com/touch/2.4.0/apidocs/#!/api/Ext.data.Connection-cfg-defaultHeaders

来自Ext.data.Connection的来源

setupHeaders: function(xhr, options, data, params) {
    var me = this,
        headers = Ext.apply({}, options.headers || {}, me.getDefaultHeaders() || {}),
        contentType = me.getDefaultPostHeader(),
        jsonData = options.jsonData,
        xmlData = options.xmlData,
        key,
        header;

sencha touch覆盖ext.ajax

3 个答案: