我很难找到使用fetch实现上传进度指示器的文档或示例.
这是迄今为止我发现的唯一参考资料,其中指出:
进度事件是一个高级功能,暂时无法获取.您可以通过查看
Content-Length标头并使用传递流来监视接收的字节来创建自己的标头.这意味着您可以无需另外明确地处理响应
Content-Length.当然,即使在Content-Length那里也可能是谎言.使用流可以根据需要处理这些谎言.
如何编写"传输流来监控字节"发送?如果它产生任何差异,我正在尝试这样做以支持从浏览器到Cloudinary的图像上传.
注意:我对Cloudinary JS库不感兴趣,因为它依赖于jQuery而我的应用程序没有.我只对使用原生javascript和Github的polyfill 执行此操作所需的流处理感兴趣.fetch
我试图用取一个ReadableStream.在这个例子中,ReadableStream应该无限期地重复"Some data ...".
fetch('/', {
method: 'POST',
body: new ReadableStream({
pull: function(controller) {
console.log('pull called!');
controller.enqueue('Some data...');
}
})
});
Run Code Online (Sandbox Code Playgroud)
这不起作用.而pull被执行一次,没有数据被请求体中的发送.
POST / HTTP/1.1
Host: example.com
Connection: keep-alive
Content-Length: 0
Origin: https://example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.99 Safari/537.36
Accept: */*
Referer: https://example.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.8
Run Code Online (Sandbox Code Playgroud)
如何使用fetch可用的ReadableStream(或任何我可以编写动态数据的流)?
或者,如果这还不可能,请您说明一下吗?谢谢.
注意:这是一个更具体的衍生问题: 通过HTTP将数据从浏览器传输到服务器的方法