XMLHttpRequest如何監(jiān)控進(jìn)度

小樊
125
2024-06-19 16:12:04

要監(jiān)控XMLHttpRequest的進(jìn)度，可以使用XMLHttpRequest對(duì)象的progress事件。通過監(jiān)聽progress事件，可以實(shí)時(shí)獲取請(qǐng)求的進(jìn)度信息。

以下是一個(gè)簡(jiǎn)單的示例代碼：

var xhr = new XMLHttpRequest();

xhr.open('GET', 'example.com/api/data', true);

xhr.onload = function() {
  // 請(qǐng)求完成時(shí)的處理
};

xhr.onprogress = function(e) {
  if (e.lengthComputable) {
    var percentComplete = (e.loaded / e.total) * 100;
    console.log('Progress: ' + percentComplete + '%');
  }
};

xhr.send();

在上面的代碼中，通過監(jiān)聽xhr對(duì)象的onprogress事件，可以獲取到當(dāng)前請(qǐng)求的進(jìn)度信息。使用e.loaded和e.total屬性可以獲取已加載的字節(jié)數(shù)和總字節(jié)數(shù)，從而計(jì)算出當(dāng)前進(jìn)度的百分比。

需要注意的是，要在send()方法之前設(shè)置onprogress事件處理程序，以確保能夠捕獲到請(qǐng)求進(jìn)度的更新。

0 踩