发送请求后触发 jQuery ajaxPrefilter

Question

根据jQuery.ajaxPrefilter() 的描述，它应该在请求发送到$.ajax() 之前被触发，但从我在项目中看到的情况来看，首先调用服务器API 端点，然后调用@987654323 @ 函数被调用，此时进行任何更改都为时已晚。

我可能在这里遗漏了一些东西，但我没有看到它......

我的注册如下所示：

$.ajaxPrefilter(function (options, originalOptions, jqXHR) {
    if (options.url.startsWith('api') || options.url.startsWith('/api')) {

        if (options.headers === undefined) {
            options.headers = {};
        }

        if (!options.headers.Authorization) {
            var jwt = sessionStorage.getItem('accessToken');
            jqXHR.setRequestHeader('Authorization', 'Bearer ' + jwt);
        }
    }
});

我完全知道我可以使用beforeSend 来设置标头，但我想通过首先检查标头是否存在来做到这一点，如果不存在，则添加它，这是读取请求标头的唯一方法据我所知，在发送之前只能使用ajaxPrefilter。

我可能最终会使用beforeSend，但我很好奇为什么它不像文档中描述的那样工作？也许我没有完全理解它是如何工作的......

我使用的是 jQuery 版本 3.3.1。

编辑：

设置async: false 似乎可以解决问题，但对我来说这似乎是 jQuery 中的一个错误。

编辑 2：

我想我可能在某个地方遇到了一些错误，因为现在上面的代码可以工作了。我不知道这个错误可能在哪里，因为通过查看我的 git 更改它根本不明显，但它现在可以工作......

Answer 1

这种方式应该可行（在$.ajaxPrefilter，在你的条件下）：

options.beforeSend = function (xhr) { 
  xhr.setRequestHeader('Authorization', 'Bearer ' + jwt);
}

但是，老实说，我不确定为什么不能将它们设置为 jqXHR。这对我来说似乎也是合乎逻辑的。

你的代码变成：

$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
  if (options.url.startsWith('api') || options.url.startsWith('/api')) {

    if (options.headers === undefined) {
      options.headers = {};
    }

    if (!options.headers.Authorization) {
      var jwt = sessionStorage.getItem('accessToken');
      options.beforeSend = function(xhr) {
        xhr.setRequestHeader('Authorization', 'Bearer ' + jwt);
      }
    }
  }
});