如何使用 AngularJS 從 ASP.NET Web API 下載檔案？

使用 AngularJS 從 ASP.NET Web API 方法下載檔案

使用 AngularJS 進行開發時，通常需要從外部來源下載檔案。這可以透過向傳回所需文件的 Web API 方法發出 HTTP GET 請求來實現。

在 AngularJS 中實作請求

要在 AngularJS 中啟動下載過程，您可以使用 $http 服務向您的 Web API 方法發出 HTTP GET 請求。以下是一個範例：

$scope.getthefile = function () {
  $http({
    method: 'GET',
    cache: false,
    url: $scope.appPath + 'CourseRegConfirm/getfile',
    headers: {
      'Content-Type': 'application/json; charset=utf-8'
    }
  }).success(function (data, status) {
    // Handle the downloaded file here
  }).error(function (data, status) {
    // Handle any errors that may occur
  });
}

從Web API 方法傳回檔案

在ASP.NET Web API 方法中，您需要設定回應以指示傳回的內容是一個可供下載的檔案。以下是一個範例：

[Authorize]
[Route("getfile")]
public HttpResponseMessage GetTestFile()
{
  HttpResponseMessage result = null;
  var localFilePath = HttpContext.Current.Server.MapPath("~/timetable.jpg");

  if (!File.Exists(localFilePath))
  {
    result = Request.CreateResponse(HttpStatusCode.Gone);
  }
  else
  {
    // Serve the file to the client
    result = Request.CreateResponse(HttpStatusCode.OK);
    result.Content = new StreamContent(new FileStream(localFilePath, FileMode.Open, FileAccess.Read));
    result.Content.Headers.ContentDisposition = new System.Net.Http.Headers.ContentDispositionHeaderValue("attachment");
    result.Content.Headers.ContentDisposition.FileName = "SampleImg";
  }

  return result;
}

在AngularJS 處理下載的檔案

您可以使用兩種方法在AngularJS 處理下載的檔案：

1. 簡單下載：

$scope.downloadFile = function (downloadPath) {
  window.open(downloadPath, '_blank', '');
}

2. Ajax 二進位下載：

Ajax 二進位下載：

$scope.downloadFile = function (httpPath) {
  $http.get(httpPath, { responseType: 'arraybuffer' })
  .success(function (data, status, headers) {
    // Handle the downloaded file here using the data
  }).error(function (data, status) {
    // Handle any errors that may occur
  });
}

>請記得將您的Web API方法配置為指定適當的回應標頭，包括 x-filename 和內容類型。 透過實作這些技術，您可以使用 AngularJS 從 ASP.NET Web API 方法無縫下載文件，確保流暢且實用的使用者體驗。

以上是如何使用 AngularJS 從 ASP.NET Web API 下載檔案？的詳細內容。更多資訊請關注PHP中文網其他相關文章！