android項目中在webview中打開pdf。
關於android打開pdf文件方法有多種,下面的文章有詳細說明:
總結一下:
1、WebView 中調用 GoogleDocs
這個方案要翻牆!!!
2、調起第三方支持 PDF 閱讀的應用
建議使用這種方法,擴展性兼容性強,可以擴展爲支持其他的文件格式。但是如果用戶手機沒有安裝PDF的應用,就比較尷尬了。
3、集成第三方 PDF SDK,在 Native 頁面中閱讀
第三方包很大,APK體積會增大20M左右,不介意APK體積的可以採用。
4、將 PDF 文件轉換成 HTML 或者圖片等格式文件
這種方案是比較low,但是能解決部分問題
5、集成第三方JS:pdf.js
這種方案有兩種方式集成:服務端和客戶端,因爲準備在android端實現所以介紹客戶端集成的方案。
客戶端集成也有兩種方式,
①將pdf.js和相關的文件全部下載下來並拷貝的工程中的assets目錄。pdf.js和相關文件體積也比較大(5M左右),同樣會增加APK體積,但是這種方式更快,全部都是本地資源,不需要每次都聯網加載pdf.js文件。
②就是使用CDN的方式。在asset目錄想編寫html文件和js文件,加載網絡中的pdf.js的相關資源。但是相對第一中方法比較慢,如果而且文件過大,會報錯。具體實現參考文章 Android中顯示PDF的問題解決(安卓端使用pdf.js CDN模式)
我使用的是集成第三方的pdf.js,並且把所有資源下載到本地。
核心方法
1、pdf.js資源到android項目的asset目錄 下載地址 http://mozilla.github.io/pdf.js/getting_started/#download
2、使用webview加載viewer.html界面
mWebView.loadUrl(file:///android_asset/pdf/web/viewer.html?file=PDFURl)
(其中PDFURL爲pdf文件路徑,可以是網絡路徑也可以是本地文件)
超級簡單!!
但是實際操作中遇到很多的問題
1、webView 打失敗,報錯 unexpected server response (0) while retrieving PDF
webview的權限設置有問題,需要設置:
webSettings.setJavaScriptEnabled(true);//支持js
webSettings.setAllowFileAccess(true);;//否允許訪問文件,默認允許訪問
webSettings.setAllowFileAccessFromFileURLs(true);//一個文件被允許訪問其他文件中的內容
webSettings.setAllowUniversalAccessFromFileURLs(true);//可以是否訪問任何原始起點內容
2、打開失敗, file origin does not match viewer's
處理方法:需要在web/viewer.js(1793行)中註釋的代碼如下:
// if (origin !== viewerOrigin && protocol !== 'blob:') {
// throw new Error('file origin does not match viewer\'s');
// }
3、低版本android手機(5.0)打開失敗,
檢查之後發現是低版本android瀏覽器不支持es6語法。
最簡單的處理方法,下載es5版本的pdf.js。但是這個版本比es6版本大,有11M
在網上有文章提到 4.4及以下版本,有兼容問題,需要使用低版本的pdf.js。我們項目不支持4.4及以下版本,所有沒有測試。處理方法是判斷android系統版本, 4.4及以下版本使用低版本的pdf.js(文章使用的1.4版本的),高版本系統,使用當前最新的pdf.js。
4、屏蔽下載按鈕
實現使用中發現,工具欄用些功能在android手機上是不能使用的,比如下載、打印。
解決方案:隱藏工具欄中的按鈕,web/viewer.html找到 id="secondaryDownload",在button標籤添加 style="display:none"。
注意,在文件中還有id="download"的按鈕,隱藏該按鈕並沒有使界面中下載按鈕消失