在ASP.NET MVC3使用pdf.js

我期待在github上PDF.js項目，看着我來到了這個他們的基本演示（整個視圖）：在ASP.NET MVC3使用pdf.js

@{ 
    ViewBag.Title = "GetPDFLetter"; 
    Layout = null; 
} 

<!doctype html> 
<html> 
<head> 
     <title>PDF.JS TEST</title> 
     <!-- PDF.js-specific --> 
     <script src="@Url.Content("~/Scripts/jquery-1.8.2.min.js")" type="text/javascript"></script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/pdf.js")"> </script> 

    <script type="text/javascript" src="@Url.Content("~/PDFScripts/core.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/util.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/api.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/canvas.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/obj.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/function.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/charsets.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/cidmaps.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/colorspace.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/crypto.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/evaluator.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/fonts.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/glyphlist.js")"> </script>> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/image.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/metrics.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/parser.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/pattern.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/stream.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/worker.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/jpg.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/jpx.js")"> </script> 
    <script type="text/javascript" src="@Url.Content("~/PDFScripts/jbig2.js")"> </script> 

     <script type="text/javascript"> 
      // Specify the main script used to create a new PDF.JS web worker. 
      // In production, change this to point to the combined `pdf.js` file. 
      var url = '@Url.Content("~/PDFScripts/worker_loader.js")'; 
      PDFJS.workerSrc = url; 
    </script> 
</head> 

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

    <script type="text/javascript"> 

     $(document).ready(function() { 

      /* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */ 
      /* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */ 

      // 
      // See README for overview 
      // 

      'use strict'; 

      // 
      // Fetch the PDF document from the URL using promices 
      // 
      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); 
       }); 
      }); 



     }); 
    </script> 
</html>

文件helloworld.pdf與視圖位於同一文件夾中，但是當我運行該項目時，沒有任何渲染，只是一個小矩形。我錯過了什麼嗎？任何特殊的考慮？謝謝你的幫助。

來源

2012-12-12 Mohammad Sepahvand

我們是否需要添加上面提到的所有JavaScript文件？總共有22個js文件.. –

@Ranadheer自從我和Pdf.js一起工作已經18個月了，我不確定發生了什麼變化等。你可以看看Github的問題，並試着在那裏問。關於劇本，顯然你需要他們，但你可以嘗試捆綁他們。 –

最終顯示出來。多麼棒的圖書館PDF.js是。我曾冒昧creating a sample MVC3 project using PDF.js。它遵循Github上PDF.js演示的90％，除了一個微小的，自我解釋（在代碼的註釋中解釋）改變爲查看器分配PDF文件路徑。

來源

2012-12-21 12:33:47

我也無法訪問示例項目。你能否解釋一下你需要對文件路徑進行哪些修改？ – xm1994

@ xm1994現在看看 –

@MohammadSepahvand：當我用外部文件的URL替換本地文件的url時，出現錯誤。任何幫助？在索引頁中，我更改了 ** @ Html.ActionLink（「View Pdf＃1」，「Viewer」，「Home」，new {filePath =「Pdf1.pdf」}，null）** 至 * *@Html.ActionLink（「View Pdf＃1」，「Viewer」，「Home」，new {filePath =「myExternalFileUrl.pdf」}，null）** 並在控制器中我更改了** filePath =「/ MyPDFs/「+ filePath; **到** filePath = filePath; **是否有任何其他地方可以更改代碼？ –

在ASP.NET MVC3使用pdf.js

回答

相關問題