axios multipart / form-data - получить приблизительное время компиляции - PullRequest
0 голосов
/ 13 ноября 2018

Есть ли способ получить приблизительное время компиляции для отправки файлов ('content-type': 'multipart/form-data') через axios или другую http-библиотеку? например -

const formData = new FormData();
formData.append('file', file) //file=event.target.files[0]
const config = {
  headers: {
    'content-type': 'multipart/form-data'
  }
}
return post(url, formData, config); //axios post

Для очень больших файлов я хочу отобразить таймер для пользователя. Я могу использовать другие библиотеки, поэтому axios не обязателен. Я могу получить доступ к размеру файла - file.size и получить доступ к нисходящей линии связи - navigator.connection.downlink, но я не знаю правильный расчет.

1 Ответ

0 голосов
/ 13 ноября 2018

Существует способ отслеживать ход отправки XMLHttpRequest

См. документы на mdn здесь

var oReq = new XMLHttpRequest();

oReq.addEventListener("progress", updateProgress);
// progress on transfers from the server to the client (downloads)
function updateProgress (oEvent) {
  if (oEvent.lengthComputable) {
    var percentComplete = oEvent.loaded / oEvent.total * 100;
    // ...
  } else {
    // Unable to compute progress information since the total size is unknown
  }
}

Также axios (см. документы ) сам по себе имеет параметр конфигурации для обновления пользовательского интерфейса при выполнении:

onUploadProgress: function( progressEvent ) {
        this.uploadPercentage = parseInt( Math.round( ( progressEvent.loaded * 100 ) / progressEvent.total ) );
      }.bind(this)
...