怎么在Android中使用PDF.js瀏覽pdf文件-創(chuàng)新互聯(lián)

今天就跟大家聊聊有關(guān)怎么在Android中使用PDF.js瀏覽pdf文件，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結(jié)了以下內(nèi)容，希望大家根據(jù)這篇文章可以有所收獲。

創(chuàng)新互聯(lián)公司-專(zhuān)業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比東阿網(wǎng)站開(kāi)發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫(kù),直接使用。一站式東阿網(wǎng)站制作公司更省心,省錢(qián),快速模板網(wǎng)站建設(shè)找我們，業(yè)務(wù)覆蓋東阿地區(qū)。費(fèi)用合理售后完善，十年實(shí)體公司更值得信賴。

一 WebView設(shè)置：

WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setAllowFileAccess(true);
webSettings.setAllowFileAccessFromFileURLs(true);
webSettings.setAllowUniversalAccessFromFileURLs(true);

二實(shí)現(xiàn)方式

方式一: 使用mozilla部署在github pages上的Viewer

View.loadUrl("http://mozilla.github.io/pdf.js/web/viewer.html?file=" + pdfUrl);

這種方式和使用google docs是差不多一樣的，重要的是國(guó)內(nèi)可以直接訪問(wèn)，但是會(huì)遇到跨域的問(wèn)題。

方式二: 下載PDF.js放到assets目錄下

怎么在Android中使用PDF.js瀏覽pdf文件

如果pdf文件不能跨域訪問(wèn)的話可以使用這種方式，先把文件下載到本地然后傳入本地文件路徑預(yù)覽pdf：

 mWebView.loadUrl("file:///android_asset/pdfjs/web/viewer.html?file=" + pdfUrl);

PDF.js本身是一個(gè)比較大的庫(kù)，如果全部放到本地的話apk差不多會(huì)增大5m左右。所以我們可以考慮吧PDF.js部署到服務(wù)端或者使用cdn的方式。

方式三:自定義預(yù)覽界面，PDF.js使用cdn的方式導(dǎo)入

1.首先寫(xiě)一個(gè)預(yù)覽的index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
     content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
  <title>Document</title>
  <style type="text/css">
    canvas {
      width: 100%;
      height: 100%;
      border: 1px solid black;
    }
  </style>
  <script src="https://unpkg.com/pdfjs-dist@1.9.426/build/pdf.min.js"></script>
  <script type="text/javascript" src="index.js"></script>
</head>
<body>
</body>
</html>

2.實(shí)現(xiàn)預(yù)覽index.js

var url = location.search.substring(1);

PDFJS.cMapUrl = 'https://unpkg.com/pdfjs-dist@1.9.426/cmaps/';
PDFJS.cMapPacked = true;

var pdfDoc = null;

function createPage() {
  var div = document.createElement("canvas");
  document.body.appendChild(div);
  return div;
}

function renderPage(num) {
  pdfDoc.getPage(num).then(function (page) {
    var viewport = page.getViewport(2.0);
    var canvas = createPage();
    var ctx = canvas.getContext('2d');

    canvas.height = viewport.height;
    canvas.width = viewport.width;

    page.render({
      canvasContext: ctx,
      viewport: viewport
    });
  });
}

PDFJS.getDocument(url).then(function (pdf) {
  pdfDoc = pdf;
  for (var i = 1; i <= pdfDoc.numPages; i++) {
    renderPage(i)
  }
});

3.WebView加載html

 mWebView.loadUrl("file:///android_asset/index.html?" + pdfUrl);

這樣我們最終放到assets目錄下的就index.html和index.js兩個(gè)文件，可以避免直接全部導(dǎo)入帶來(lái)的apk體積增大的問(wèn)題，如果我們對(duì)預(yù)覽UI和交互有要求的話可以方便的通過(guò)修改html來(lái)實(shí)現(xiàn)。

三遇到的問(wèn)題

在直接實(shí)現(xiàn)預(yù)覽的時(shí)候遇到顯示模糊的問(wèn)題，通過(guò)增大scale系數(shù)解決

var viewport = page.getViewport(2.0);//設(shè)置為2.0

pdf內(nèi)容顯示不完整，通過(guò)設(shè)置cMapUrl和cMapPacked解決

PDFJS.cMapUrl = 'https://unpkg.com/pdfjs-dist@1.9.426/cmaps/';
PDFJS.cMapPacked = true;

看完上述內(nèi)容，你們對(duì)怎么在Android中使用PDF.js瀏覽pdf文件有進(jìn)一步的了解嗎？如果還想了解更多知識(shí)或者相關(guān)內(nèi)容，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝大家的支持。

文章名稱：怎么在Android中使用PDF.js瀏覽pdf文件-創(chuàng)新互聯(lián)
分享URL：http://jinyejixie.com/article8/coedip.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)網(wǎng)站制作、網(wǎng)站建設(shè)、網(wǎng)站導(dǎo)航、定制網(wǎng)站、企業(yè)建站、自適應(yīng)網(wǎng)站

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

成人午夜视频全免费观看高清-秋霞福利视频一区二区三区-国产精品久久久久电影小说-亚洲不卡区三一区三区一区

怎么在Android中使用PDF.js瀏覽pdf文件-創(chuàng)新互聯(lián)