Question

我已经搜索并找到了关于此问题的多个问题，但是每次尝试这些响应时，我总是只下载一个文件或别名。

我尝试使用代码制作下载文件（.h264和.json），对于某些人来说似乎可行：
-Download multiple files with a single action
-How can I let a user download multiple files when a button is clicked?

我最后的尝试是：

function(uri, data, name) {
    let link = document.createElement("a");
    link.download = name;
    link.href = 'data:'+data+';charset=utf-8;base64,'+uri;
    link.target = "blank_";
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  }

uri是axios之前获取的文件数据。 data是哑剧类型。

此功能在这里使用：

ListPath.forEach(path => {
    axios.all([axios.get(path+".h264"), axios.get(path+".json")]).then((data) => {
        console.log(data[0], data[1]);
        Utils.downloadFile(data[0].data, 'video/H264', "movie.h264");
        Utils.downloadFile(data[1].data, 'application/JSON', "data.json");
      }).catch(error => console.log(error))
})

当我单击下载一件事（一个h264和他的json关联）时，它尝试仅下载json并失败（“网络错误”），然后重定向到about:blank。如果我在json行中添加注释，它除了下载以外也不会下载任何东西。

我还尝试了window.open()的方法，因此代码如下：

ListPath.forEach(path => {
    window.open(path+".h264", '_blank');
    window.open(path+".json", '_blank');
})

此处已下载h264视频，但它仅提供真实链接的别名（例如，如果我们在http://mywebsite.com/data.json上下载文件，并且在文件中以http://mywebsite.com/data.json给出一行），并且仅显示在其他标签上的json。

我正在macOS下使用chrome进行测试。

我也尝试过js-download-file npm模块，但问题与以前相同。

Answer 1

尝试一下

VERSION_BOWER=`node -p -e "require('./package.json').dependencies.bower"`
npm install --no-package-lock --no-save bower@"$VERSION_BOWER"

如何在React中下载多个文件

1 个答案: