全局设置 Ext.Ajax 请求的额外参数

本文介绍了在 ExtJS 7 应用中全局设置 Ext.Ajax 请求额外参数的方法。通过监听 beforerequest 事件，可以在每次 Ajax 请求发送前修改请求参数，从而实现全局添加额外参数的需求，避免修改大量的现有代码。

在 ExtJS 应用开发中，经常会遇到需要在所有 Ajax 请求中添加一些公共参数的需求，例如用户身份验证信息、版本号等。如果逐个修改每个 Ajax 请求，将会非常繁琐且容易出错。ExtJS 提供了 beforerequest 事件，允许我们在每次 Ajax 请求发送前拦截并修改请求参数，从而实现全局添加额外参数的目的。

实现方法

1. 监听 beforerequest 事件

   首先，我们需要找到一个在应用启动时只会执行一次的地方，例如 Application.js 文件，并在其中添加 Ext.Ajax.on(‘beforerequest’, …) 监听器。

   Ext.application({
   name: 'MyApp',
   extend: 'MyApp.Application',
   requires: [
   'MyApp.view.main.Main'
   ],
   launch: function () {
   Ext.Ajax.on('beforerequest', function(conn, options, eOpts) {
   // 在这里添加额外参数
   });
   Ext.create('MyApp.view.main.Main');
   }
   });

2. 修改请求参数

   在 beforerequest 事件的处理函数中，我们可以通过 options 参数访问到当前请求的所有选项，包括 URL (options.url) 和参数 (options.params)。我们可以直接修改 options.params 对象，添加我们需要的额外参数。

   Ext.Ajax.on('beforerequest', function(conn, options, eOpts) {
   // 检查是否需要添加额外参数，例如根据 URL 判断
   if (options.url.indexOf('/api/') > -1) {
   // 添加额外参数
   options.params = options.params || {}; // 确保 options.params 存在
   options.params.myNewParam = 'New Param';
   }
   });

   上面的代码首先判断请求的 URL 是否包含 /api/，如果包含，则添加 myNewParam 参数。注意，需要先判断 options.params 是否存在，如果不存在则需要创建一个空对象。

完整示例

Ext.application({
name: 'MyApp',
extend: 'MyApp.Application',
requires: [
'MyApp.view.main.Main'
],
launch: function () {
Ext.Ajax.on('beforerequest', function(conn, options, eOpts) {
// 添加额外参数
options.params = options.params || {};
options.params.apiKey = 'YOUR_API_KEY';
options.params.version = '1.0';
console.log('Ajax Request URL:', options.url);
console.log('Ajax Request Params:', options.params);
});
Ext.create('MyApp.view.main.Main');
}
});

在这个示例中，我们添加了 apiKey 和 version 两个额外参数，并使用 console.log 打印请求的 URL 和参数，方便调试。

注意事项

• 参数覆盖: 如果请求本身已经包含了与额外参数同名的参数，那么额外参数将会覆盖原有的参数。因此，需要谨慎选择参数名，避免冲突。
• 条件判断: 并非所有的 Ajax 请求都需要添加额外参数。可以通过 URL、请求类型等条件判断是否需要添加额外参数，提高代码的灵活性和效率。
• 性能影响: 频繁的 beforerequest 事件处理可能会对性能产生一定的影响。尽量减少事件处理的逻辑，避免复杂的计算。

总结

通过监听 beforerequest 事件，我们可以方便地在 ExtJS 应用中全局设置 Ext.Ajax 请求的额外参数。这种方法避免了修改大量的现有代码，提高了代码的可维护性和可扩展性。在实际应用中，可以根据具体的需求，灵活地使用条件判断和参数设置，实现更加精细的控制。