从Blazor客户端应用程序从ASP.NET Core API下载文件

debugcn 发表于 Dev

让·丹尼尔·加瑟（Jean-Daniel Gasser）

我创建了一个返回FileStreamResult对象的ASP.NET Core API控制器。（如果需要，我可以更改结果的类型）

这是Get函数的代码：

[HttpGet("[action]/{p_gInspectionID}/{p_nIndex}")]
public async Task<FileStreamResult> GetInspectionPictureToDownload(Guid p_gInspectionID, int p_nIndex)
{
  var l_strFilePath = await GetPictureFilePathAsync(p_gInspectionID, p_nIndex);

  using (var l_sReader = System.IO.File.OpenRead(l_strFilePath))
  {
    return (File(l_sReader, "image/jpeg"));
  }
}

现在，我需要在Blazor（Webassembly）客户端应用程序中使用此结果。

我的目标是要有一个按钮，当用户单击文件时，可以在浏览器中启动文件下载。

这将启动浏览器的下载功能。是否可以在Blazor客户端应用程序中实现此目的？

让·丹尼尔·加瑟（Jean-Daniel Gasser）

这是我解决问题的方法。实际上，解决方案非常简单。感谢@Data Juggler为我指出正确的方向。

我的Blazor解决方案包含两个项目：

服务器端API（Blazor服务器）
客户端（Blazor WebAssembly）。

这是服务器端的代码：

[AllowAnonymous]
[HttpGet("[action]/{p_strPictureFilePath}")]
public IActionResult GetInspectionPicture(string p_strPictureFilePath)
{
  var l_sReader = System.IO.File.OpenRead(p_strPictureFilePath);

  return (File(l_sReader, "application/octet-stream", Path.GetFileName(p_strPictureFilePath)));
}

...以及客户端代码：

在client-shared.js文件中添加了此脚本：

window.downloadInspectionPicture = function (p_strServerFilePath)
{
  var link = document.createElement('a');
  link.href = 'api/Data/GetInspectionPicture/' + this.encodeURIComponent(p_strServerFilePath);
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
}

当然，在index.html以下位置存在对该文件的引用：

  <script src="client-shared.js"></script>

最后，在剃刀文件中添加一个链接，并在单击链接时调用脚本：

<a href="javascript:void(0)" @onclick="@(async () => await DownloadPictureAsync())">Download</a>

@code
{
  [Inject]
  IJSRuntime ThisJSRuntime { get; set; }

  private async Task DownloadPictureAsync()
  {
    await ThisJSRuntime.InvokeVoidAsync("downloadInspectionPicture", ServerFilePath);
  }
}

希望我的答案是明确的，并且对某人有用

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。