Javascript Node JS：预览下载图像*

我正在制作一个node.js应用程序，主要用于从web下载图像。我创建了这个函数，可以成功下载图像。我想让功能也显示一个实时预览的图像，因为它是下载而不影响下载速度。是否可以在下载到html画布或img时“点击管道”并绘制图像？我正在使用electron，因此我正在寻找基于chromium/node.js的解决方案

编辑： 我还发现您可以（

r.pipe（file）.pipe（canvas）；

）但我不确定这是否会先下载文件，然后显示在canvas上，还是会在文件下载时更新它们

我还考虑过从请求中创建两个单独的管道（

var r=request（url）；r.pipe（文件）；r.pipe（canvas）；

），但我不确定这是否会尝试下载两次图像

我对html画布也不是特别熟悉，也无法测试这些想法，因为我不知道如何将图像通过管道传输到画布或img元素，以便在应用程序中显示

const fs = require('fs-extra');
downloadFile(url, filename) {
    return new Promise(resolve => {
        var path = filename.substring(0, filename.lastIndexOf('\\'));
        if (!fs.existsSync(path)) fs.ensureDirSync(path);
            var file = fs.createWriteStream(filename);
            var r = request(url).pipe(file);
            // How would also pipe this to a canvas or img element?
            r.on('error', function(err) { console.log(err); throw new Error('Error downloading file') });
            r.on('finish', function() { file.close(); resolve('done'); });         
    });
}

---

我最后问了另一个类似的问题，为这个问题提供了答案。事实证明，关键是将图像导入内存，用base64编码，并使用data:image url显示它。

我认为这取决于图像的编码方式。有些允许渐进渲染，有些则不允许。我认为您不能使用

元素，因为这将生成一个单独的HTTP请求。不确定如何/是否可以使用canvas。。。。