Блог

Я пытаюсь загрузить файл (изображение или PDF) с помощью angular, но безуспешно. Я сделал, как показано ниже

 <a href="https://localhost:44344/UploadedFiles/IMG_20190314_205925_3be1d2b3-3bac-4184-8468-995d58d5ff80.jpg">Downlod image</a>
  

Изображение открывается на той же вкладке, но не загружается.

Итак, я подумал сделать это через Web API Core. Для этого я написал приведенный ниже код.

         public async Task<IActionResult> DownloadFile(string filename)
        {
            if (filename == null)
                return Content("filename not present");

            var path = Path.Combine(
                           _hostingEnvironment.ContentRootPath,
                           "UploadedFiles", filename);

            var memory = new MemoryStream();
            using (var stream = new FileStream(path, FileMode.Open))
            {
                await stream.CopyToAsync(memory);
            }
            memory.Position = 0;
            return File(memory, GetContentType(filename), Path.GetFileName(path));
        }

        private string GetContentType(string path)
        {
            var types = GetMimeTypes();
            var ext = Path.GetExtension(path).ToLowerInvariant();
            return types[ext];
        }

        private Dictionary<string, string> GetMimeTypes()
        {
            return new Dictionary<string, string>
            {
                {".pdf", "application/pdf"},
                {".png", "image/png"},
                {".jpg", "image/jpeg"},
                {".jpeg", "image/jpeg"},
            };
        }
  

Затем я вызвал этот api с помощью Swagger, тогда он работает.

Но когда я сделал это с angular 7, как показано ниже

HTML-код

  <button type="button" (click)="downloadFile(doc.documentName)">Download</button>
  

код файла component.ts

  downloadFile(fileName: string) {
    this.documentService.downloadFile(fileName).subscribe((res: any) => {
      console.log(res);
    });
  

service.ts

 downloadFile(fileName: any) {
    return this.http.get(this.baseUrl   "Document/DownloadFile/"   fileName);
  }
  

Когда я запускаю свое приложение, нажимаю на кнопку загрузки, функция api выполняется успешно, но в angular в консоли появляется ошибка, подобная приведенной ниже.

В чем проблема? Я просто хочу, чтобы файл был загружен нажатием кнопки. пожалуйста, направьте меня.

Для простейшего способа достижения ваших требований вы могли бы использовать <a href без вызова кода angular.

 <a href="https://localhost:44344/Document/DownloadFile/file name">Downlod image</a>
  

Генерируйте приведенный выше URL-адрес с помощью вашей собственной бизнес-логики.

Обратите внимание, что приведенный выше URL-адрес является путем для DownloadFile действия вместо статических файлов в wwwroot старше.