Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

网络请求-3-fetch 下载进度 勘误

Aperta
#1,246 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
45/100
Tipo di issue
Documentazione
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
javascript
Ambito
documentation

Direzione di ricerca

Inizia con l’articolo sull’avanzamento di fetch all’indirizzo https://zh.javascript.info/fetch-progress e rivedi l’esempio che usa response.body.getReader(), Content-Length e receivedLength. Correggi la spiegazione o l’esempio in modo che tenga conto delle risposte compresse e conferma che il calcolo dell’avanzamento documentato corrisponda al flusso di byte restituito da fetch.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

原文链接：https://zh.javascript.info/fetch-progress

在Content-Encoding指定了某种压缩方式时，fetch提供的getReader中读取到的是解压缩后的二进制流，而Content-Length所指示的是解压缩前的请求体大小。

在绝大多数场景，浏览器自动指示Accept-Encoding的情况下，不能直接使用Content-Length作为完整报文长度进行进度计算，而应当使用其它方式/响应头告知客户端完整的报文长度。

原文中示例代码如下：

// Step 1：启动 fetch，并获得一个 reader
let response = await fetch('https://api.github.com/repos/javascript-tutorial/en.javascript.info/commits?per_page=100');

const reader = response.body.getReader();

// Step 2：获得总长度（length）
const contentLength = +response.headers.get('Content-Length');

// Step 3：读取数据
let receivedLength = 0; // 当前接收到了这么多字节
let chunks = []; // 接收到的二进制块的数组（包括 body）
while(true) {
  const {done, value} = await reader.read();

  if (done) {
    break;
  }

  chunks.push(value);
  receivedLength += value.length;

  console.log(`Received ${receivedLength} of ${contentLength}`)
}

// 以下略
Lingua principale
HTML
Stelle
10.8k
Fork
1.2k
Nessuna PR unita negli ultimi 30g

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di javascript-tutorial/zh.javascript.info

Tutte le issue di javascript-tutorial/zh.javascript.info

Issue simili

Altre issue su Documentation

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.