Home Articles

单击按钮下载图像数组

Asked
Viewed 1535 times
2

我有一个非常基本的html块,有一个 button 下载:

<div id="getImageWrapper">
    <div class="image">
        <p class="image-name">{{imageName}}</p>
        <button class="download-btn" @click="getImage">Download image/s</button>
    </div>
</div>

下载按钮的 getImage() 函数从服务器获取图像列表数组 .

getImage() {
    const getImagesUrl = this.$store.state.website + '/api/get-requested-user-Images/';
    this.$http.get(getImagesUrl)
        .then(function (response) {
            console.log(response.data);
        })
        .catch(function (response) {
            console.log(response);
        });
}

来自服务器的响应数据如下所示:

[
  {
    "image": "/media/1492960503_66.jpeg"
  },
  {
    "image": "/media/1492963100_0.jpeg"
  }
]

我的问题是下一步该做什么,以便将这个图像数据下载到用户的设备中(不是作为单个压缩文件,而是作为单独的单个图像文件),这在大多数浏览器中都可以使用?如果它有帮助,我使用Django作为后端,Vuejs作为前端 .

1 Answer

  • 1

    您无法使用JavaScript压缩所有图片 . 对于压缩文件,您应该在后端(see post for zipping on fly)执行此操作,然后您可以从浏览器下载它 .

Related