Блог

Обновить:

Чтобы было понятно, мы используем <embed #reportPdf width="100%" height="800"> и

 this.pdf.nativeElement.src = this._window.URL.createObjectURL(this.re);
  

Это работает в Safari и Firefox, но при загрузке в Chrome отображается, как показано ниже, затем, если мы нажмем кнопку открыть, выдается сообщение об ошибке: Не разрешено загружать локальный ресурс: blob

Оригинал:

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

Наш серверный сервер — Spring boot, и теперь функциональность загрузки работает должным образом, но я не знаю, как добиться предварительного просмотра.

Некоторые мысли: — доступ к файлу сервера через URL, как заставить его работать? Нужно ли нам настраивать на стороне сервера?

Интерфейс:

 download(sessionGuid: string) {
    return this.http.get(`${this.fileUrl}/files/${fileId}`, {
        headers: new HttpHeaders({
            'Content-Type': 'application/pdf'
        }),
        responseType: 'blob'
    });
}
  

Серверная часть:

 private void downloadFile(HttpServletResponse response, String fileFullName) throws IOException {
    File file = new File (fileFullName);
    if (file.exists()) {
        String mimeType = URLConnection.guessContentTypeFromName(file.getName());
        if (mimeType == null) {
            mimeType = "application/octet-stream";
        }
        response.setContentType(mimeType);
        response.setHeader("content-Disposition", String.format(DISP_TYPE " filename="   file.getName()));
        response.setContentLength((int) file.length());
        InputStream inputStream = new BufferedInputStream(new FileInputStream(file));
        FileCopyUtils.copy(inputStream, response.getOutputStream());
    }
    else {
        response.sendError(HttpServletResponse.SC_NOT_FOUND);
    }
}
  

Вы должны преобразовать свой PDF-файл в изображение (например, первую страницу). Затем вы можете выполнить предварительный просмотр через <img src="..."></img>