Angular 2 сохранить файл из Nodejs

Question

У меня есть отсканированный код в NodeJS, чтобы попытаться выполнить загрузку с моего сервера.

router.post("/download", function(req, res, next) {
  console.log(req);
  filepath = path.join(__dirname, "/files") + "/" + req.body.filename;
  console.log(filepath);
  res.sendFile(filepath);
});

Это мой код Angular 2: Component.ts

  download(index) {
    var filename = this.attachmentList[index].uploadname;
    this._uploadService
      .downloadFile(filename)
      .subscribe(data => saveAs(data, filename), error => console.log(error));
  }

Service.ts

export class UploadService {
  constructor(private http: HttpClient, private loginService: LoginService) {}
  httpOptions = {
    headers: new HttpHeaders({
      "Content-Type": "application/json",
      responseType: "blob"
    })
  };

  downloadFile(file: string): Observable<Blob> {
    var body = { filename: file };
    console.log(body);
    return this.http.post<Blob>(
      "http://localhost:8080/download",
      body,
      this.httpOptions
    );
  }

В своем ответе на HTML я правильно записал файл в инструмент проверки сети моего браузера. Однако Angular пытается проанализировать ответ в объект JSON, который, очевидно, не работает, так как ответ является BLOB-объектом.

Я получаю следующую ошибку:

Неожиданный% токена в JSON в позиции 0 в JSON.parse () на XMLHttpRequest.onLoad угловой 2

У кого-нибудь есть решение для этого?

Заранее спасибо!

Answer 1

Я решил, что в служебном коде я удалил после сообщения, потому что это заставило мой возврат получить двоичный файл, а не JSON. Теперь код это так:

  downloadFile(file: string): Observable<Blob> {
    var body = { filename: file };
    console.log(body);
    return this.http.post<Blob>(
      "http://localhost:8080/download",
      body,
      this.httpOptions
    );
  }

Спасибо всем.

Answer 2

Попробуйте следующие параметры http:

{
    responseType: 'blob',
    observe:'response'
}

После этого вы получите ответ типа HttpResponse<Blob>, поэтому data.body в вашем сервисе даст вам большой двоичный объект, который вы можете передать saveAs.

Более подробную информацию о наблюдениях вы можете найти здесь:

https://angular.io/guide/http#reading-the-full-response