Anguar 6 открыть PDF из байтового массива, отправленного из WebAPI

Question

Привет! У меня проблемы с открытием pdf из байтового массива, отправленного WebAPI.

Мой сервис:

getPdfDocument(): Observable<any> {
        return this.httpClient
            .get(this.configuration.serverUrl + this.configuration.getPdfDoc, {
                responseType: "arraybuffer" //tried with 'blob'
            });
}

Мой компонент:

this.service.getPdfDocument()
        .subscribe(data => {
            var file = new Blob([data], { type: 'application/pdf' });   
            this.pdfContent = URL.createObjectURL(file);
            window.open(this.pdfContent);
        })

Когда я запускаю его, мне не удается загрузить PDF-документ ... Я включил всплывающие окна, которые все еще не радуют ...

Answer 1

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

сервис:

getPdfDocument(): Observable<any> {
    let headers = new HttpHeaders({ 'Content-Type': 'application/JSON' });
    return this.httpClient
               .get(this.configuration.serverUrl + this.configuration.getPdfDoc,
                    { headers: headers, responseType: 'blob' as 'json', observe: 'response' as 'body' }
                });
        }

запрос:

this.service.getPdfDocument()
        .subscribe(
                (data) => {
                    this.openFileForPrint(data);
                });

openFileForPrint(data: HttpResponse<any>) {
        let fileUrl = window.URL.createObjectURL(data);
        window.open(fileUrl, '_blank', 'location=yes,height=600,width=800,scrollbars=yes,status=yes');
    }

Серверная сторона

[HttpGet]
public HttpResponseMessage getpdf(DateTime datum, int idlokacija)
{
    var r = _printService.getdata(datum, idlokacija);
    if (r == null)
    {
        return new HttpResponseMessage(HttpStatusCode.NotFound);
    }
    return SendPdfFile(r);
}

public static HttpResponseMessage SendPdfFile(string filePath, bool brisanje = true)
{
    var stream = new FileStream(filePath, FileMode.Open);
    HttpResponseMessage response = new FileHttpResponseMessage(filePath, brisanje)
    {
        StatusCode = HttpStatusCode.OK,
        Content = new StreamContent(stream)
    };
    response.Content.Headers.ContentType = new MediaTypeHeaderValue("application/pdf");
    return response;
}

Answer 2

Попробуйте изменить responseType с arraybuffer на blob.

Вы также можете использовать приведенный ниже трюк, чтобы иметь возможность установить имя файла:

let a = document.createElement("a");
a.href = URL.createObjectURL(result);
a.download = "File_name_xxx";
a.click();

Также полезно знать URL.createObjectURL не будет работать на IE11.Вы должны использовать window.navigator.msSaveOrOpenBlob метод для поддержки IE11.Это потребует дополнительных условий в зависимости от браузера пользователя.