移动端网页打开查看 pdf 文件

最新推荐文章于 2025-07-05 07:45:00 发布

今天天气不错丶

最新推荐文章于 2025-07-05 07:45:00 发布

阅读量1.1w

点赞数

CC 4.0 BY-SA版权

分类专栏： Web应用文章标签： pdf

本文链接：https://blog.youkuaiyun.com/wxwsfl/article/details/80925041

Web应用专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一种通过pdf.js实现在网页中预览PDF文件的方法。主要包括：1. 下载并配置pdf.js；2. 将PDF文件放入项目指定目录；3. 后台处理流程，包括根据URL获取PDF文件，并将数据写入输出流；4. 前端调用相应事件以打开PDF文件。

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

1.首先下载 pdf.js

2.将pdf解压，放入项目中webapp下

3.后台处理：根据url获取pdf，把数据写入到输出流

js：

download: function (url) {
    var urls = '${contextPath}/***/open?urls='+url;
    window.location.href = "${ctxStatic}/pdf/web/viewer.html?file="+encodeURIComponent(urls);
},

后台：

@RequestMapping(value = "/open",method = RequestMethod.GET)
public void open(String urls,HttpServletResponse response) throws IOException {
    URL httpUrl=new URL(urls);
    HttpURLConnection httpURLConnection=(HttpURLConnection) httpUrl.openConnection();
    InputStream inputStream=httpURLConnection.getInputStream();
    response.setHeader("Content-disposition", "attachment; filename=" + new String( "PDF文件名".getBytes("gb2312"), "ISO8859-1" ) );
    response.setContentType("multipart/form-data");
    OutputStream outputStream = response.getOutputStream();
    IOUtils.write(IOUtils.toByteArray(inputStream),outputStream);
}

4.调用事件，就会打开pdf了