|
最近遇到一個(gè)需求,要在html頁(yè)面查看pdf生成的pdf文件! 翻來(lái)覆去找到兩種辦法 ,最后采用了jquery.media.js插件 方式一將pdf轉(zhuǎn)為圖片保存,然后再把圖片的地址發(fā)到頁(yè)面進(jìn)行顯示。 遇到的困難,pdf轉(zhuǎn)為圖片時(shí)中文可能會(huì)亂碼! 方式二通過(guò)js插件在線預(yù)覽pdf (這里推薦第3中插件) js插件有三種 1 pdf.js下載地址 https://github.com/mozilla/pd... 提供兩種使用方式 PDF.js可以實(shí)現(xiàn)在html下直接瀏覽pdf文檔,是一款開(kāi)源的pdf文檔讀取解析插件,非常強(qiáng)大,能將PDF文件渲染成Canvas。PDF.js主要包含兩個(gè)庫(kù)文件,一個(gè)pdf.js和一個(gè)pdf.worker.js,一個(gè)負(fù)責(zé)API解析,一個(gè)負(fù)責(zé)核心解析。 感興趣請(qǐng)查看這篇博客 https://www.cnblogs.com/zhang... 缺點(diǎn)官網(wǎng)項(xiàng)目文件過(guò)多,不太容易理解。看著頭就大! pdfobject.js缺點(diǎn)pdfobject.js 對(duì)瀏覽器有要求,可能出現(xiàn)不能加載pdf文件,今天我的谷歌瀏覽器上死活無(wú)法顯示pdf文件無(wú)賴又換了其他的。 可能會(huì)報(bào)錯(cuò) not allow to load resource 3 jquery.media.js簡(jiǎn)單輕量,引入js 然后加載路徑即可。 下載地址jquery.media.rar(解壓密碼:www.crowsong.xyz): http://waternote./f... 用法如下: 使用方法引用所需兩個(gè)文件 使用方法首先要引入js文件
其次添加頁(yè)面加載完畢后需要執(zhí)行的js代碼,以預(yù)覽PDF為例:
最后添加HTML代碼:
將插件中HTML頁(yè)面中的a標(biāo)簽下href改為想要的pdf地址即可。 |
|
|