PDF預覽 (引入pdf.js)
pdf.js是一款開源的pdf文件讀取解析外掛,據說在HTML5下誕生的,對於主流的瀏覽器基本都支援。
pdf.js主要包含兩個庫檔案,一個pdf.js和一個pdf.worker.js,,一個負責API解析,一個負責核心解析
程式的結構翻譯
build/
pdf.js display layer,顯示層採用核心層並且暴露了一個更容易使用的API來渲染PDF檔案,並獲得其他的資料出文 件。該API基於不同的版本號而不同。
pdf.worker.js core layer core層是PDF解析和解釋核心功能,是所有其它層的基礎
web/
cmaps/ character maps(required by core) 字元對映(core層需要的資源)
compatibility.js polyfills for missing features Polyfilling 是由 RemySharp提出的一個術語,它是用來描述複製缺少的 API和API功能的行為。
09.pdf test pdf 測試用的pdf檔案
debugger.js helpful pdf debugging features
images/ images for the viewer and annotation icons viewer介面的圖示
l10n.js localization
locale/ translation files 翻譯檔案,包含所有支援語言的翻譯資源
viewer.css viewer style sheet viewer介面的css
viewer.html viewer html,viewer主介面
viewer.js viewer layer,viewer介面的js,頁面引數包括載入的PDF檔案路徑都在這裡設定
在viewer.js中,var DEFAULT_URL 是預設的PDF檔案地址,當動態載入檔案時,要刪除這個欄位,在HTML中,
<script type="text/javascript">
var BASE64_MARKER = ';base64,';
var preFileId = "";
var pdfAsDataUri = "";
var DEFAULT_URL
$(document).ready(function () {
Request = GetRequest();
preFileId = Request["id"];
$.ajax({
type: "post",
async: false,
contentType: "application/pdf;charset=utf-8",
url: 讀取檔案流地址,
success: function (data) {
var pdfAsDataUri = data;
var pdfAsArray = convertDataURIToBinary(pdfAsDataUri);
DEFAULT_URL = pdfAsArray;
}
});
});
function convertDataURIToBinary(dataURI) { //編碼轉換
var raw = window.atob(dataURI);//這個方法在ie核心下無法正常解析。
var rawLength = raw.length;
//轉換成pdf.js能直接解析的Uint8Array型別
var array = new Uint8Array(new ArrayBuffer(rawLength));
for (i = 0; i < rawLength; i++) {
array[i] = raw.charCodeAt(i) & 0xff;
}
return array;
}
</script>
下載pdf.zip的地址:https://pan.baidu.com/s/1EkXSzn7Z4CrutTg4GqeIgw