Как получить прогресс загрузки файла с помощью потоков fetch() и WhatWG

Question

Примечание: я не ищу никаких альтернатив. Я знаю, что это можно сделать с помощью XMLHttpRequest. Я также не забочусь о поддержке браузера. Я просто хочу узнать о новых / будущих стандартах.

У меня есть объект File, и я могу загрузить его с помощью PUT, используя fetch:

fetch(url, {
    method: "PUT",
    body: fileObject,
});

Как я могу получить прогресс загрузки из этого?

Из того, что я понимаю body из опций выборки может быть ReadableStream. Так, может быть, есть способ обернуть объект File в ReadableStream и получить от него статус прогресса?

Например. что-то вроде этого

fetch(url, {
    method: "PUT",
    body: asReadableStream(fileObject, onProgress),
});

Благодарю.

Answer 1

Как сказал Кайл, загрузка ReadableStream пока не поддерживается. https://github.com/whatwg/fetch/issues/95

Даже если бы это было возможно, я бы не стал следить за ходом загрузки через потоки (то есть, если FetchObserver станет чем-то особенным). Сейчас над этим никто не работает. Но Mozilla сделала предложение, которое выглядит примерно так.

/*
enum FetchState {
  // Pending states
  "requesting", "responding",

  // Final states
  "aborted", "errored", "complete"
};
*/

fetch(url, {
  observe(observer) { 
    observer.onresponseprogress = e => console.log(e);
    observer.onrequestprogress = e => console.log(e);
    observer.onstatechange = n => console.log(observer.state)
  }
)

Я помню, что я тестировал его с использованием некоторых экспериментальных флагов давным-давно, но больше не могу найти демо, думаю, они удалили его из MDN, так как там была собственная реализация / предложение.

Answer 2

Краткий ответ: не может быть сделано прямо сейчас.

Ознакомьтесь со спецификацией здесь: https://fetch.spec.whatwg.org/

Второе предложение указывает на то, что нет способа отследить ход выполнения запроса при использовании fetch.

Метод fetch() является относительно низкоуровневым API для извлечения ресурсов. Он охватывает чуть больше оснований, чем XMLHttpRequest, хотя в настоящее время его не хватает, когда речь идет о прогрессировании запросов (не о прогрессировании ответов).