Fetch 响应体流式保存到 OPFS 实践

概述通过读取响应流并逐块写入 OPFS，可降低内存占用并提高稳定性。流式保存async function saveResponseToOPFS(url, path) { const res = await fetch(url); if (!res.body) { const buf = await res.arrayBuffer(); return writeAll(path, new Uint8Array(buf)); } const root = await navigator.storage.getDirectory(); const segments = path.split('/').filter(Boolean); let dir = root; for (let i=0;i<segments.length-1;i++) dir = await dir.getDirectoryHandle(segments[i], { create: true }); const fh = await dir.getFileHandle(segments[segments.length-1], { create: true }); const ws = await fh.createWritable(); const reader = res.body.getReader(); while (true) { const { value, done } = await reader.read(); if (done) break; await ws.write(value); } await ws.close(); } async function writeAll(path, bytes) { const root = await navigator.storage.getDirectory(); const segments = path.split('/').filter(Boolean); let dir = root; for (let i=0;i<segments.length-1;i++) dir = await dir.getDirectoryHandle(segments[i], { create: true }); const fh = await dir.getFileHandle(segments[segments.length-1], { create: true }); const ws = await fh.createWritable(); await ws.write(bytes); await ws.close(); }