springboot+pdfjs+iframe在线预览PDF，以及出现空白问题

阿杰杰1314

于 2022-05-10 09:35:01 发布

阅读量1.4k

点赞数

本文链接：https://blog.csdn.net/ajiejie66/article/details/124680954

版权

本文介绍了如何使用SpringBoot和PDFJS在Vue前端结合ElementUI实现PDF在线预览，同时针对可能出现的空白问题进行分析，提出解决方案，涉及到axios配置responseType为'blob'。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue前端+element

<el-dialog
  custom-class="pdfChargeClass"
  :visible.sync="pdfVisible"
  width="900px">
  <template>
    <iframe class="prism-player" :src="pdfUrl" width="100%" height="800px"></iframe>
  </template>
</el-dialog>

springboot后端

/**
     * 文件预览
     * @param response
     * @throws IOException
     */
    @GetMapping("/previewPdf")
    @ResponseBody
    public void previewPdf(String fileId, HttpServletResponse response) throws IOException {
   
//        "D:\\tmp\\1519559233116921858.pdf"
        InputStream in = null;
        OutputStream out = response.getOutputStream();
        try {
   
            File file = new File("D:\\tmp\\1519559233116921858.pdf");
            if (file.exists()){
   
                response.res