Asp.net Core Web API - Downloading multiple images from blob storage to zip file (via Axios get)

Question

我正在尝试下载包含许多文件（各种类型）的 zip 文件 - 虽然我确实下载了 zip 文件，但不幸的是，当我尝试打开它时会引发以下错误：

zip 文件错误

图像使用 azure blob 存储进行存储。

如果您有任何想法，请提供帮助。

我的 Vue.js 前端有一个按钮，它调用以下命令：

    GetAllAssetResources ({commit},id)
    {
        console.log("Getting Asset Resources:" + id);
        return new Promise((resolve) => {
            axios.get(CONFIG.platformEndPoints+  '/asset/downloadResources/' + id)
            .then( (response) => {
                const url = window.URL.createObjectURL(new Blob([response.data]));
                const link = document.createElement('a');
                link.href = url;
                link.setAttribute('download', 'resources.zip');
                document.body.appendChild(link);
                link.click();
            })
        })
    }

这调用了我的 controller 方法（使用 C#）：

    [HttpGet]
    public async Task<IActionResult> DownloadResources(string guid)
    {
        return File(await _ResourceService.DownloadAllAssetResources(guid), MediaTypeNames.Application.Octet, "resources");
    }

这调用了我的服务：

    public async Task<byte[]> DownloadAllAssetResources(string guid)
    {
        var assetDetails = await _AssetDetails.FindAsync(guid);
        var resources = assetDetails.res.ToList();
        byte[] archiveFile;

        await using (var archiveStream = new MemoryStream())
        {
            using (var archive = new ZipArchive(archiveStream, ZipArchiveMode.Create, true))
            {
                foreach (var file in resources)
                {
                    var fileName = guid+ "_" + file.name;
                    var zipArchiveEntry = archive.CreateEntry(fileName, CompressionLevel.Fastest);
                    var bytes = await _Storage.GetBytes("resources", fileName);

                    await using (var zipStream = zipArchiveEntry.Open())
                    {
                        zipStream.Write(bytes, 0, bytes.Length);
                    }
                }
            }

            archiveFile = archiveStream.ToArray();
        }

        return archiveFile;
    }

Answer 1

这只是更新我的 axios 调用以包含响应类型的情况：

        GetAllAssetResources ({commit},assetDetailid)
    {
        console.log("Getting Asset Resources:" + id);
        return new Promise((resolve) => {
            axios({
                url: CONFIG.platformEndPoints+  '/asset/downloadResources/' + id,
                method: 'GET',
                responseType: 'blob'})
            .then( (response) => {
                const url = window.URL.createObjectURL(new Blob([response.data]));
                const link = document.createElement('a');
                link.href = url;
                link.setAttribute('download', 'resources.zip');
                document.body.appendChild(link);
                link.click();
            })
        })
    },