使用基于 PDF.js 的 PDF 预览查看器到 CakePHP 2.x
[英]Use PDF.js based PDF preview viewer to CakePHP 2.x
问题描述
im kind of new to cakephp and Im trying to use this very nice PDF preview I found online https://gist.github.com/ichord/9808444
我是 cakephp 的新手，我试图使用我在网上找到的这个非常好的 PDF 预览https://gist.github.com/ichord/9808444
<script src="http://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.1/processing-api.min.js"></script><html> <!-- Created using jsbin.com Source can be edited via http://jsbin.com/pdfjs-helloworld-v2/8598/edit --> <body> <canvas id="the-canvas" style="border:1px solid black"></canvas> <input id='pdf' type='file'/> <!-- Use latest PDF.js build from Github --> <script type="text/javascript" src="https://rawgithub.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script> <script type="text/javascript"> // // Disable workers to avoid yet another cross-origin issue (workers need the URL of // the script to be loaded, and dynamically loading a cross-origin script does // not work) // PDFJS.disableWorker = true; // // Asynchronous download PDF as an ArrayBuffer // var pdf = document.getElementById('pdf'); pdf.onchange = function(ev) { if (file = document.getElementById('pdf').files[0]) { fileReader = new FileReader(); fileReader.onload = function(ev) { console.log(ev); PDFJS.getDocument(fileReader.result).then(function getPdfHelloWorld(pdf) { // // Fetch the first page // console.log(pdf) pdf.getPage(1).then(function getPageHelloWorld(page) { var scale = 0.8; 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 task = page.render({canvasContext: context, viewport: viewport}) task.promise.then(function(){ console.log(canvas.toDataURL('image/jpeg')); }); }); }, function(error){ console.log(error); }); }; fileReader.readAsArrayBuffer(file); } } alert(file.name) </script> <style id="jsbin-css"> </style> <script> </script> </body> </html>
but I cant make it to work with cakephp.但我不能让它与 cakephp 一起工作。
It works on my sever outside the cakephp environment, I guess I have to use it as plugin something but I cant figure it out.它可以在 cakephp 环境之外的服务器上运行，我想我必须将它用作插件，但我无法弄清楚。 It uses the pdf.js and the processing-api.js libraries and I think the problem is loading these libraries.它使用 pdf.js 和 processing-api.js 库，我认为问题在于加载这些库。
What I want is that the user preview the pdf he wants to upload before he/she uploads it我想要的是用户在他/她上传之前预览他要上传的pdf
Thank you in advance.先感谢您。
Regards问候
1 个解决方案
解决方案1
0 2015-10-02 09:08:00
I finaly found the solution for this, I added: PDFJS.workerSrc = '/js/pdf.worker.js'; 我最终找到了解决方案，我补充说： PDFJS.workerSrc ='/js/pdf.worker.js'; before PDFJS.disableWorker = true; 在PDFJS.disableWorker = true之前；
now it works! 现在可以了！
解决方案2
0 2018-09-01 08:09:11
I wish to test your code, the problem is that it does not work despite the changes made above. 我希望测试您的代码，问题是尽管进行了上述更改，但是它仍然无法正常工作。 I uploaded the file "pdf.worker.js" in the js directory of the webroot but nothing to do any results. 我在webroot的js目录中上传了文件“ pdf.worker.js”，但没有任何结果。 I would really appreciate it if you could point out my mistake so that I can get it working in my cakephp 2.8 thank you in advance 如果您能指出我的错误，以便能在我的cakephp 2.8中正常运行，我将不胜感激。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.