在使用pdf.js时,遇到一个问题,预览pdf之后,比如现在在第8页,等再次打开的时候还是在第八页,需要从第一页加载;或者可能有需求直接跳转到某一页,查了些资料发现提供的方案很多,一个好使的都没有,也有可能是我使用不当,反正都是以失败告终。最开始决定直接去读代码,通过源代码来解决这个问题,但是代码量有点大啊,只能另寻他法,后来发现关闭浏览器的时候,重新打开pdf还是从离开的页码加载,所以推测默认的配置应该时保存在localStorage,果然在view.js中发现了设置,localStorage.setItem('pdfjs.history', databaseStr)。

打印了一下存储的内容如下:

{"files":[{"fingerprint":"57f1f29cbad323c87a7921391211253d","sidebarView":0,"page":4,"zoom":"auto","scrollLeft":-17,"scrollTop":752,"rotation":0}]}

ok,现在开始解决问题。

1.展示首页

如果你想每次打开的时候都展示pdf的首页,那么直接注释view.js中的localStorage.setItem('pdfjs.history', databaseStr)即可。

2.跳转指定页

如果你想加载不同的页码,可直接在view.html中增加以下代码:

if(localStorage.getItem('pdfjs.history')){
    if(typeof JSON.parse(localStorage.getItem('pdfjs.history')) === 'object' ){
	    var history = JSON.parse(localStorage.getItem('pdfjs.history'));
		if(history.files && history.files[0]){
            // 跳转指定页码
           this.database.files[0].page = 6;
        }
	    localStorage.setItem('pdfjs.history',JSON.stringify(history));
    }
}

 

Logo

开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!

更多推荐