pdf.js框架的魅力所在，為其為HTML5實現的，無需任何本地支持，而且對浏覽器的兼容性也是比較好，要求只有一個：浏覽器支持HTML5就好了！（不過對於低版本的IE，就只能節哀了！）
據說IE9以上是OK的，因為我本地是IE11，所以我只在IE11上測試過，是通過的（當然火狐，360，我也測了一下，是可以的）。
因為項目開發需要，在線展示PDF，而且要兼容IE，所以就選擇了pdf.js，但是網上對他的教程很少，我花了一天時間才搞定，回頭看了一下，也沒有想象中那麼困難，所以決定寫一篇博客，以便大家參考！
以下是pdf.js相關的網址：
GitHub: https://github.com/mozilla/pdf.js/
上面這個網址，有pdf.js的基本簡介，以及如何獲取源碼，之後如何進行構建！
但是他的獲取源碼使用：
$ git clone git://github.com/mozilla/pdf.js.git
構建使用：
$ node make generic
不知道在Windows7上該怎麼用git、node（如果有知道的，可以告訴我下，在此謝過！），所以我就改用linux進行構建（期間有很多心酸歷程，感覺都可以拍成電影了！！！比如說我用git獲取源碼時，系統提示我git沒有安裝，我用node時，提示我ShellJs沒有安裝，安裝ShellJS，他告訴我要使用npm，意料之中，npm我也沒有安裝...），其實，我們使用pdf.js，最終只需要構建後的內容，大家可以通過這裡進行下載：
------------------------------------------分割線------------------------------------------
免費下載地址在 http://linux.linuxidc.com/
用戶名與密碼都是www.linuxidc.com
具體下載目錄在 /2015年資料/6月/12日/pdf.js使用教程/
下載方法見 http://www.linuxidc.com/Linux/2013-07/87684.htm
------------------------------------------分割線------------------------------------------
構建後的目錄結構為：
有了構建後的build內容，我們就可以做一個簡單的測試，把generic拷貝到Tomcat的webapps中
啟動Tomcat後，就可以通過：
http://localhost:8080/generic/web/viewer.html
進行訪問！可以看到一個很帥氣的界面：
generic/web/viewer.html主要是渲染pdf閱讀器的樣式，而generic/web/viewer.js則是指定打開的pdf文件（當然還有其他功能，不過這些都不是我們關心的），我們看位於generic/web/viewer.js的一段代碼：
我們可以看到，他默認打開generic/web/compressed.tracemonkey-pldi-09.pdf文件，再來看下面這段代碼：
這就告訴我們，可以通過傳遞file形參來動態指定打開的pdf文件！如：
http://localhost:8080/generic/web/viewer.html?file=qbs.pdf
下面我就介紹下，具體嵌入項目中是如何運用的！
可以把generic中的內容作為第三方插件進行使用，在項目中可以像如下存放：
然後頁面可以使用<iframe>標簽來加載pdf
<iframe src="<c:url value="/resources/plugin/pdfJs/generic/web/viewer.html" />?file=<c:url value="/publicity/displayPDF.do" />" width="100%" height="800"></iframe>
效果圖，如下：
實質就是我們直接訪問generic/web/viewer.html，然後為其指定一個file形參，用於指定打開的pdf文件！我上面使用的流的方式進行指定的。
上面只是一種簡單的使用方式，下面介紹一種復雜點的使用方式：
不知道大家有沒有試過下面這段url請求:
http://localhost:8080/akane/resources/plugin/pdfJs/generic/web/viewer.html?file=/akane/displayPDF.do?id=966c6f0e-3c06-4154-aafd-afdbee5bcb65
我們在實際應用中，可能會根據不同的參數，來選擇展示不同的pdf文件，此時就涉及到傳參的問題了，仔細觀察上面這段url地址會發現，在file請求參數中的值為一個url地址，而這個url地址又追加了自己的請求參數，這就導致一個url地址中出現2個"?"
導致浏覽器不能正常解析這段url！
一種解決思路是：我們可以把file形參的值，先編碼，然後再解碼來解決這個問題！
此時，就可以請encodeURIComponent()函數出場了！因為其為js函數，所以需要在文檔就緒函數中動態為iframe設置src的值，如下所示：
<%@ page contentType="text/html;charset=GBK" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<script type="text/javascript">
$(function(){
$("#displayPdfIframe").attr("src",'<c:url value="/resources/plugin/pdfJs/generic/web/viewer.html" />?file=' + encodeURIComponent('<c:url value="/displayPDF.do?id=${id}"/>'));
});
</script>
<div class="ctrlDiv">
<div class="eleContainer elePaddingBtm">
<iframe id="displayPdfIframe" width="100%" height="100%"></iframe>
</div>
</div>
既然有編碼，那麼就一定要有解碼來解析他，不過這個工作generic/web/viewer.js已經替我們做過了，如下所示：
至此，pdf.js插件的介紹就告一段落了，第一次寫博客，如有不到之處，希望大家可以不吝賜教，謝謝！
在此感謝pdf.js的兩位作者！（真心佩服這些外國大師，2個人可以寫一個這麼好的框架，而且還是開源的！）。
