Как получить имя файла, загруженного с Angular5

Question

Заголовки моего ответа:

HTTP/1.1 200 OK
Content-Disposition: attachment; filename="file.docx"
Accept-Ranges: bytes
Cache-Control: public, max-age=0
Last-Modified: Thu, 26 Apr 2018 10:37:00 GMT
ETag: W/"c61-16301871843"
Content-Type: application/vnd.openxmlformats-officedocument.wordprocessingml.document
Content-Length: 3169
Date: Thu, 26 Apr 2018 10:37:00 GMT
Connection: keep-alive

Я попробовал этот код,

 public download(id: string): Observable<Blob> {
    let headers = new Headers();
    const _baseUrl = (Api.getUrl(Api.URLS.download));
    headers.append('x-access-token', this.auth.getCurrentUser().token);
    headers.append('sale_id', id);
    return this.http.get(_baseUrl, { headers: headers, responseType: ResponseContentType.Blob})
      .map((res) => {
        console.log(res.headers) // show like in image
        return new Blob([res.blob()], { type: 'application/octet-stream' })
      });
  }

, которые отображаются в консоли:

Не показывалось Content-Disposition !!

Как получить имя файла из заголовков?

Answer 1

Ваш сервер должен вернуть определенный заголовок, Access-Control-Expose-Headers. Если вы этого не сделаете, Angular не раскрывает заголовок, объясняя, почему вы не видите его.

Вы можете найти больше информации здесь (хотя это немного устарело) и даже больше информации здесь

Answer 2

На самом деле, тело ответа в угловых не возвращает все данные, которые вам могут понадобиться. Поэтому нам нужно указать, что нам нужен полный ответ. Для этого вам нужно добавить HTTPOptions с и заметить: «response» как «body» в сервисе,

var HTTPOptions = {
     headers: new HttpHeaders({'Accept': 'application/pdf; charset=UTF-8',}),
     observe: "response" as 'body',// to display the full response & as 'body' for type cast
     'responseType': 'blob' as 'json'
 }

 return this.http.get(url, HTTPOptions);

Тогда вы сможете получить полный ответ, подписавшись на этот метод,

this.service.download().subscribe((result: HttpResponse<any>) => {
 console.log(result);
 console.log(result.headers.getAll('Content-Disposition'));
}, err => {});

Подробнее см. В угловой документации

Answer 3

попробуйте это:

 (res: Response) => {
  const contentDisposition = res.headers.get('content-disposition') || '';
  const matches = /filename=([^;]+)/ig.exec(contentDisposition);
  const fileName = (matches[1] || 'untitled').trim();
  return fileName;
};