Question

我需要为所有d3.js xhr调用设置标头。我知道你可以设置它进行单数调用

d3.json("/path").header('X-Requested-With', 'XMLHttpRequest')

我正在寻找像jQuery的beforeSend方法

之类的东西

$.ajaxSetup({
    beforeSend: function(xhr) {
      xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    }
  });

Answer 1

您可以查看d3源代码（查找function d3_xhr），或者只是接受我的话（我只是看），因为没有办法为{{1}指定默认标头}

然而，没有什么能阻止你为此创建和使用自己的方法，比如

d3.json()

从而允许你像这样发出json请求

function myJson(args) {
  // call d3's json, passing through any arguments that were
  // passed into myJson(), and then set the headers you want
  return d3.json.apply(null, arguments)
    .header('X-Requested-With', 'XMLHttpRequest');
}

这当然要求您在任何地方使用myJson('/path', function(json) {...})代替myJson()。但是，如果您确定始终始终希望在调用d3.json时始终默认设置这些标头，那么您可以继续（喘气）覆盖d3.json之类的内容上面的自定义d3.json。例如：

myJson

从那时起，当您从应用中的任何位置拨打// save the originial implementation of d3.json var d3Json = d3.json; // define your own implementation of d3.json, which relies on // the original implementation d3.json = function() { // notice the use of d3Json — NOT d3.json, as shown above return d3Json.apply(null, arguments) .header('X-Requested-With', 'XMLHttpRequest'); }时（这包括可能会调用d3.json(...)的任何供应商代码），它将运行您的自定义功能，而后者又会调用原始 d3.json并设置默认标头。

Answer 2

出于某种原因，meetamit的d3建议对我没有用，所以我将其改为how the d3 documentation suggests to add the header：

// save the originial implementation of d3.json
var d3Json = d3.json;

// define your own implementation of d3.json, which relies on
// the original implementation
d3.json = function(url, handler) {
    // notice the use of d3Json — NOT d3.json, as shown above
    return d3Json(url).header('X-Requested-With', 'XMLHttpRequest').get(handler);
}

Answer 3

现在在遥远的 2021 年，D3 使用 Fetch API 而不是 XHR。这意味着在请求上设置 headers 的方法是不同的。

json() 方法的 D3 代码如下：

function json(input, init) {
  return fetch(input, init).then(responseJson);
}

可以看出，D3 json() 方法允许将配置对象直接传递给 Fetch API。这意味着，如果您按以下方式调用该方法，则可以在请求中设置标头。

d3.json("/some-path-to-call", {headers: {"X-Requested-With": "XMLHttpRequest"}})

d3.js ajax默认标头/发送前

3 个答案: