2015-09-30 2 views
0

им вид новых для CakePHP и Im пытаются использовать это очень хороший предварительный просмотр PDF я нашел в Интернете https://gist.github.com/ichord/9808444Использование pdf.js на основе предварительного просмотра PDF для просмотра в CakePHP 2.x

<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>​

но Я не могу заставить его работать с cakephp.

Он работает на моем севере вне среды cakephp, я предполагаю, что мне нужно использовать его как плагин, но я не могу понять это. Он использует библиотеки pdf.js и processing-api.js, и я думаю, что проблема заключается в загрузке этих библиотек.

То, что я хочу, что предварительный просмотр пользователь Ф он хочет, чтобы загрузить, прежде чем он/она будет загружать его

Спасибо заранее.

Привет

+0

похоже, проблема связана с перенаправлением, когда я отлаживаю, я вижу, что pdf.js отправляет эту ошибку: ожидаемое выражение, получило '<' , как пытающийся прочитать index.php, потому что cakephp перенаправляет его на этот файл ... это происходит здесь PDFJS.getDocument (fileReader.result) – rimba

ответ

0

Я, наконец нашел решение для этого, я добавил: PDFJS.workerSrc = '/js/pdf.worker.js'; перед PDFJS.disableWorker = true;

сейчас это работает!

Смежные вопросы