Angular 7 не может загрузить файл с помощью API ядра c # .net - PullRequest
Новая
       87

Angular 7 не может загрузить файл с помощью API ядра c # .net

0 голосов
/ 26 февраля 2019

У меня есть угловое приложение, где одна из сеток имеет столбец с гиперссылкой на CSV-файл.Этот CSV находится на сетевом диске.

Когда пользователь щелкает ссылку, он должен иметь возможность сохранить файл на своем компьютере (при условии, что все пользователи имеют доступ).

Я использую file-saver для загрузки / сохранения файла.

Это мой c # core api контроллер.Для тестирования у меня есть жестко закодированное имя файла c:\temp\test.csv.В реальном приложении Angular вызывает API с желаемым файлом (включая полный путь).

[HttpGet("DownLoadFile/{fileName}")]
public HttpResponseMessage DownLoadFile( string fileName)
        {
            try
            {
                fileName = @"c:\temp\test.csv"; //Hard Coding for testing only. 

                if (!string.IsNullOrEmpty(fileName))
                {

                        HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);
                        var fileStream = new FileStream(fileName, FileMode.Open);
                        response.Content = new StreamContent(fileStream);
                        response.Content.Headers.ContentType = new MediaTypeHeaderValue("text/csv");
                        response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
                        response.Content.Headers.ContentDisposition.FileName = fileName;
                        return response;
                        //return ResponseMessage(response);
                }
                return new HttpResponseMessage(HttpStatusCode.NotFound);
            }
            catch (Exception ex)
            {

                return new HttpResponseMessage(HttpStatusCode.NotFound);
            }
        }

Служба Angular: 

public getFile(filePath:string): Observable<Blob>{
    console.log(filePath);
    let path = 'http://localhost:19090/api/testAPI/DownLoadFile/testfile.csv';
    let options = new RequestOptions({responseType: ResponseContentType.Blob });
    return this._http.get(path, {responseType: 'blob'})
    .pipe(
      catchError(this.handleError));

  }

Код компонента: В моем приложении используется Kendo Grid.

private downloadFile( dataItem: any):void{
  this._sharedService.getFile(dataItem.test_file)
  .subscribe(
     (data:Blob) => {
       saveAs(data, `Test_1.csv`); // from file-saver library
      },
     (err: any) => {
        console.log(`Unable to save file ${JSON.stringify(err)}`)}
    );
}

Этот код загружает CSV-файл, но выглядит как: 

   {"version":{"major":1,"minor":1,"build":-1,"revision":-1,"majorRevision":-1,"minorRevision":-1},"content":{"headers":[{"key":"Content-Type","value":["text/csv"]},{"key":"Content-Disposition","value":["attachment; filename=\"c:\\temp\\blaze.csv\""]}]},"statusCode":200,"reasonPhrase":"OK","headers":[],"requestMessage":null,"isSuccessStatusCode":true}

Что я делаю не так?Есть указатели?

Вот некоторые ссылки, которые я использовал для устранения неполадок:

Как загрузить файл с Angular2

Angular загрузить CSV-файлс Web Api 2

ОБНОВЛЕНИЕ:

Благодаря этой ссылке - https://expertcodeblog.wordpress.com/2018/08/13/asp-net-core-angular-how-to-download-file-from-api-controller/

Мне удалось решить моюпроблема.Я обновил свой код контроллера и смог загрузить файл.

1 Ответ

0 голосов
/ 26 февраля 2019

Согласно моему обновлению, я смог обновить свой контроллер, и это решило мою проблему.Без изменений в коде клиента.

public async Task<IActionResult> DownloadFile(string filename)
        {
            try
            {
                string file = @"c:\temp\test.csv";

                var memory = new MemoryStream();
                using (var stream = new FileStream(file, FileMode.Open))
                {
                    await stream.CopyToAsync(memory);
                }

                memory.Position = 0;
                return File(memory, GetMimeType(file), filename);
            }
            catch (Exception e)
            {
                return BadRequest(e);
            }
        }
...