h5项目中预览后端返回的pdf文件流

移动端预览后端返回的pdf文件流

最近在用vue开发H5项目时,需要预览pdf文件,后端返回的是文件流,查了很多资料,前端解析流文件生成url等都不行,最后使用了pdf js 插件,并在地址中直接包后端接口地址和需要的参数即可,具体如下:

  1. 首先下载pdf.js 下载地址:http://mozilla.github.io/pdf.js/getting_started/#download
  2. 将下载的文件解压,放到static下面h5项目中预览后端返回的pdf文件流_第1张图片
  3. 调用方法中这样写即可:h5项目中预览后端返回的pdf文件流_第2张图片
  4. 一定要使用encodeURIComponent 进行编码,不然没效果,encodeURIComponent换号里就是后端的接口,querys里面就是需要传递给后端的参数。
  5. 好了,现在就可以正常预览pdf文件了,效果如下 :h5项目中预览后端返回的pdf文件流_第3张图片
    记录一下工作中的坑,如果哪位大神有更好的方法,欢迎分享!

你可能感兴趣的:(h5预览pdf文件流,vue,html5)