如何在d3 xhr发送请求中指定超时

时间:2017-10-25 05:15:09

标签: javascript http d3.js xmlhttprequest timeout

我想设置一个超时值,这样如果服务器在该特定时间范围内没有响应,那么UI应该向前移动而不是等待响应。到目前为止,我已经使用了以下语法,但它并没有限制UI监听指定的时间。

      d3.xhr(my_url)
        .header('Content-Type', 'text/xml')
        .header('timeout', 2000)
        .send(this.my_method, my_xmlData, function(error, data) {
        }

我读到here d3 xhr现在支持超时功能。谁能告诉我如何正确使用它?

1 个答案:

答案 0 :(得分:2)

只需将时间(以毫秒为单位)传递给timeout(版本4.x):

.timeout(time)

这是一个例子。我将加载一个没有timeout的JSON文件:

var url = "https://mysafeinfo.com/api/data?list=englishmonarchs&format=json";

d3.json(url)
  .get(callback);

function callback(data) {
  console.log(data)
}
<script src="https://d3js.org/d3.v4.min.js"></script>

现在使用相同的代码,在超时(非常短的时间)内使用1毫秒:

var url = "https://mysafeinfo.com/api/data?list=englishmonarchs&format=json";

d3.json(url)
  .timeout(1)
  .get(callback);

function callback(data) {
  console.log(data)
}
<script src="https://d3js.org/d3.v4.min.js"></script>

正如您所看到的,1毫秒获取文件的时间太短,并且回调将按预期返回null