本文介绍如何在 ExtJS 7 应用中，为所有通过 Ext.ajax 发起的请求自动添加一个或多个默认参数。通过监听 Ext.Ajax 的 beforerequest 事件，我们可以在每次请求发送前修改请求参数，从而实现全局参数的添加，避免手动修改每一个 Ajax 请求。
在 ExtJS 7 应用中，为所有 Ext.Ajax 请求添加默认参数，通常不需要修改每一个请求的配置。一个更优雅和高效的方法是利用 Ext.Ajax 提供的事件机制，特别是 beforerequest 事件。
beforerequest 事件在每次 Ext.Ajax 发起请求之前触发。通过监听这个事件，我们可以拦截请求，并修改请求的配置，例如添加额外的参数。
实现步骤：
-
找到合适的入口点： 选择一个在应用启动时只执行一次的地方，例如 Application.js 文件中的 launch 方法。
-
监听 beforerequest 事件： 在选定的入口点添加以下代码，监听 Ext.Ajax 的 beforerequest 事件。
Ext.Ajax.on('beforerequest', function(conn, options, eOpts) { // 在这里修改请求参数 }); -
修改请求参数： 在事件处理函数中，可以访问到请求的配置对象 options。options.params 包含了请求的参数。我们可以直接修改 options.params 来添加新的参数。
Ext.Ajax.on('beforerequest', function(conn, options, eOpts) { if (!options.params) { options.params = {}; } options.params.myNewParam = 'New Param'; });这段代码首先检查 options.params 是否存在，如果不存在则创建一个新的空对象。然后，它添加了一个名为 myNewParam 的参数，并将其值设置为 New Param。
完整示例：
假设你的 Application.js 文件如下所示：
Ext.define('MyApp.Application', { extend: 'Ext.app.Application', name: 'MyApp', launch: function () { // 监听 Ext.Ajax 的 beforerequest 事件 Ext.Ajax.on('beforerequest', function(conn, options, eOpts) { if (!options.params) { options.params = {}; } options.params.myNewParam = 'New Param'; }); // 其他启动逻辑... } });
注意事项：
-
条件判断： 并非所有请求都需要添加相同的参数。可以在事件处理函数中添加条件判断，根据 options.url 或其他属性来决定是否添加参数。例如，只为特定 URL 的请求添加参数：
Ext.Ajax.on('beforerequest', function(conn, options, eOpts) { if (options.url.indexOf('/api/') === 0) { if (!options.params) { options.params = {}; } options.params.myNewParam = 'New Param'; } }); -
参数覆盖： 如果请求本身已经包含了同名的参数，那么上述代码将会覆盖原有的参数值。如果需要保留原有的参数值，可以先检查参数是否存在。
Ext.Ajax.on('beforerequest', function(conn, options, eOpts) { if (!options.params) { options.params = {}; } if (!options.params.myNewParam) { options.params.myNewParam = 'New Param'; } }); -
安全性： 在添加参数时，需要注意安全性问题，避免将敏感信息暴露在请求中。
总结：
通过监听 Ext.Ajax 的 beforerequest 事件，我们可以方便地为所有 Ext.Ajax 请求添加默认参数，避免了手动修改每个请求的配置。这种方法不仅简洁高效，而且易于维护和扩展。记住要根据实际需求添加条件判断，并注意安全性问题。
