uniapp 预览pdf文件 web-view

uniapp实现在页面当中预览pdf功能

1、下载pdfjs插件
https://mozilla.github.io/pdf.js/getting_started/#download
下载完成后在项目根目录hybrid文件夹中，将压缩包内容解压进去

pdf.png

hybrid.png

2、代码
<web-view :src="allUrl"></web-view>
<script>
export default {
  data() {
        return {
            allUrl: '',
                        url:"/static/you.pdf",
            viewerUrl: '/hybrid/html/web/viewer.html?file=', //用来渲染PDF的html
            }
        },
    },
  onLoad() {
    this.getFlow()
   },
  methods: {
    getFlow(){
                //baseURL 服务器地址 
               // #ifdef H5
               this.allUrl = this.viewerUrl + this.url;
               // #endif
               // 在安卓和ios手机上
              // 判断是手机系统：安卓，使用pdf.js
              // #ifdef APP-PLUS
                if(plus.os.name === 'Android') {
                    this.allUrl = `${this.viewerUrl}${encodeURIComponent(baseURL+this.url)}`;
                }
                // ios，直接访问pdf所在路径
                else {
                    this.allUrl = encodeURIComponent(baseURL+this.url);
                }
                // #endif
              }
          }
}
</script>