首页 > 解决方案 > 下载多个文件 (50mb) blazor 服务器端

问题描述

我真的找不到从服务器下载 100mb zip 文件到客户端并在下载时显示进度的方法。那么这将如何寻找一个可以添加到我的服务器端项目的普通 api 控制器呢?如果假设我有 3 个文件,我想以每个 50mb 的大小下载。

我试过像这样使用 JSInterop,但这没有显示文件下载的进度,如果我想同时下载 3 个单独的文件,我该怎么办?

try
    {
    //converting file into bytes array  
        var dataBytes = System.IO.File.ReadAllBytes(file);

        await JSRuntime.InvokeVoidAsync(
              "downloadFromByteArray",
              new
              {
                   ByteArray = dataBytes,
                   FileName = "download.zip",
                   ContentType = "application/force-download"
               });
     }
     catch (Exception)
     {
     //throw;
     } 

JS:

function downloadFromByteArray(options: {
    byteArray: string,
    fileName: string,
    contentType: string
}): void {

    // Convert base64 string to numbers array.
    const numArray = atob(options.byteArray).split('').map(c => c.charCodeAt(0));

    // Convert numbers array to Uint8Array object.
    const uint8Array = new Uint8Array(numArray);

    // Wrap it by Blob object.
    const blob = new Blob([uint8Array], { type: options.contentType });

    // Create "object URL" that is linked to the Blob object.
    const url = URL.createObjectURL(blob);

    // Invoke download helper function that implemented in 
    // the earlier section of this article.
    downloadFromUrl({ url: url, fileName: options.fileName });

    // At last, release unused resources.
    URL.revokeObjectURL(url);
}

更新:

如果我使用此代码,它将向我显示文件的进度。但是我怎样才能从我的代码中触发它呢?这种方式不行。但是输入网址可以。

await Http.GetAsync($"Download/Model/{JobId}");

控制器

[HttpGet("download/model/{JobId}")]
        public IActionResult DownloadFile([FromRoute] string JobId) 
        {
            if (JobId == null) 
            {
                return BadRequest();
            }

            var FolderPath = $"xxxx";
            var FileName = $"Model_{JobId}.zip";

            var filePath = Path.Combine(environment.WebRootPath, FolderPath, FileName);

            byte[] fileBytes = System.IO.File.ReadAllBytes(filePath);

            return File(fileBytes, "application/force-download", FileName);
        }

更新 2!

我已经下载了它并使用 JSInterop 点击。

public async void DownloadFiles() 
        {
            //download all selectedFiles
            foreach (var file in selectedFiles)
            {
                //download these files
                await JSRuntime.InvokeAsync<object>("open", $"Download/Model/{JobId}/{file.Name}", "_blank");
            }
        }

现在剩下的唯一问题是.. 它只下载 3 个文件中的第一个文件。

标签: .net-coreblazor-server-side

解决方案


推荐阅读