2014-01-14 24 views
-3

我想开发一个功能来在浏览器中以书籍格式读取上传的pdf文件。 任何人都可以建议我怎么做到这一点? 我想实现它使用php,jQuery的JavaScript。pdf使用fpdf库的php书籍阅读器

+1

你还读过FPDF的功能吗? –

+0

是的,在这里我正在寻找解决方案来实现这一目标。如果存在任何其他库或工具 –

回答

1

您可以使用JS对以下链接 https://github.com/mozilla/pdf.js

用法举例

<!doctype html> 
<html> 

<head> 
    <!-- In production, only one script (pdf.js) is necessary --> 
    <!-- In production, change the content of PDFJS.workerSrc below --> 
    <script type="text/javascript" src="../../src/shared/util.js"></script> 
    <script type="text/javascript" src="../../src/shared/colorspace.js"></script> 
    <script type="text/javascript" src="../../src/shared/pattern.js"></script> 
    <script type="text/javascript" src="../../src/shared/function.js"></script> 
    <script type="text/javascript" src="../../src/shared/annotation.js"></script> 
    <script type="text/javascript" src="../../src/display/api.js"></script> 
    <script type="text/javascript" src="../../src/display/metadata.js"></script> 
    <script type="text/javascript" src="../../src/display/canvas.js"></script> 
    <script type="text/javascript" src="../../src/display/font_loader.js"></script> 

    <script type="text/javascript"> 
    // Specify the main script used to create a new PDF.JS web worker. 
    // In production, leave this undefined or change it to point to the 
    // combined `pdf.worker.js` file. 
    PDFJS.workerSrc = '../../src/worker_loader.js'; 
    </script> 
    <script type="text/javascript" src="hello.js"></script> 
</head> 

<body> 
    <canvas id="the-canvas" style="border:1px solid black;"/> 
</body> 

</html> 

hello.js - 文件

// 
// Fetch the PDF document from the URL using promises 
// 
PDFJS.getDocument('helloworld.pdf').then(function(pdf) { 
    // Using promise to fetch the page 
    pdf.getPage(1).then(function(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); 
    }); 
}); 

这将帮助你提供的附件直接查看

1

我试试使用https://github.com/mozilla/pdf.js开发PDF书籍,但没有运气。

我不确定我会在“viewer.js”文件中更改哪些参数,以便制作PDF书籍。我正在避免https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-%28Windows%29文件。我可以在浏览器中打开PDF,但不能以书籍格式打开PDF。

+0

在view.js中,您将更改打开PDF的文件路径,可能是使用调用此代码的方法,并且函数参数有助于根据需要切换文件名,其余的代码应该保持不变,我看到它的工作。可能再给一次机会,你可以成功 – rsakhale