关于pdfobject.js在不同浏览器显示问题

记录下此插件在开发过程中遇到的问题。

1.插件基本使用

因为不能让用户通过插件下载文件，所以做了遮罩层，遮挡了表头。

<div class="main-left"  element-loading-background="rgba(255, 255, 255, 1)">
          <div class="pdf-mask"></div>
          <div id="pdf-content">
            
          </div>
</div>

var options = {
  width: "100%",
  height:'100%',
  forceIframe: true,
  forcePDFJS:true,//使用插件本身，而不是浏览器自带的预览
  pdfOpenParams: {
    page:"6",
    view: 'FitV',
    toolbar: 0,
    navpanes: 0,
    statesbar: 0,

    }
};

let page = 1;
let str =  '#page='+page
pdfUrl.value = url
pdf.embed(pdfUrl.value+str,"#pdf-content",options);//初次效果，自定义跳转到某页

2.注意事项

1.api中支持的pdf预览为pdf文件，后端返回文件流，先转化为本地路径。

let blob = null;
blob = res;
const blobob = new Blob([blob], { type:'application/pdf;charset=utf-8' });
let URL = window.URL || window.webkitURL;
const url = URL.createObjectURL(blobob)

2.关于不同浏览器显示的问题
因为ui里设计有目录，所以页面跳转是根据目录跳转。
在mac的chrome浏览器，会把目录默认加载出来，影响体验，设置此属性后，调用插件本身的预览，而不是用浏览器的预览。就显示正常了
forcePDFJS:true
3.隐藏所有菜单栏
项目中遇到的问题，在新版的google中会在浏览器显示左侧目录和菜单栏，看了源码发现此插件是基于embed封装，在官网并没有介绍隐藏目录的api，然后又去看了pdf.js，发现可以在路径后拼接toolbar=0去隐藏，实现需求。

 pdf.embed(pdfUrl.value+str+'&toolbar=0',"#pdf-content",options);//初次效果