這個插件可以實現(xiàn)在瀏覽器閱讀PDF文件坟募,技術(shù)原型主要用于在 HTML5 平臺上展示 PDF 文檔,無需任何本地技術(shù)支持掖肋。
好像也是Mozilla Firefox的插件
pdf.js主要包含兩個庫文件,一個pdf.js和一個pdf.worker.js一個負(fù)責(zé)API解析,一個負(fù)責(zé)核心解析箱残。
單頁PDF使用示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="build/pdf.js"></script> // 導(dǎo)入pdf.js
<script>
function showPdf() {
PDFJS.workerSrc = 'build/pdf.worker.js'; //加載核心庫
PDFJS.getDocument("web/09.pdf").then(function getPdfHelloWorld(pdf) {
//
// 獲取第一頁數(shù)據(jù)
//
pdf.getPage(1).then(function getPageHelloWorld(page) {
var scale = 1.5;
var viewport = page.getViewport(scale);
//
// Prepare canvas using PDF page dimensions
//
var canvas = document.getElementById('the-canvas');
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
//
// Render PDF page into canvas context
//
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
});
}
</script>
</head>
<body>
<a href="javascript:void(0)" target="_blank" onclick="showPdf()">顯示pdf文檔</a>
<canvas id="the-canvas"></canvas>
</body>
</html>
插件結(jié)構(gòu):
效果:
加入縮放等其他完整版功能:
直接在viewer.js修改pdf的鏈接即可