一、背景
爲了實現簡單的文件預覽功能。
二、實現過程
（1）第一步我放置了a 標籤並設置了 href 屬性
<body>
<h1>小白學習</h1>
<a href="D:/orderBomFile/order/a.png">預覽1</a><br>
<a href="D:/orderBomFile/order/c.pdf">預覽2</a><br>
</body>
（2）運行測試，出現 Not allowed to load local resource 的報錯，原因：瀏覽器出於系統安全的考慮，不允許直接訪問服務器上的本地文件。
（3）解決的方法很簡單，就是配置一個虛擬路徑，這樣瀏覽器就不會限制了。有兩種方法可進行配置：
方法一：在Eclipse上直接配置
首先雙擊打開 Tomcat 的設置頁面，接着點擊 Modules 切換頁面；
點擊 Add External Web Module...
Document base 選擇的是預覽文件的存放位置，Path 配置的是文件的虛擬路徑，這亞子等會在 a 標籤的 href 屬性配置“ /file/order/a.png ” 瀏覽器就不會攔截啦。記得配置完保存重啓 Tomcat 啊！
方法二：在 Tomcat 配置文件 server.xml 上配置
首先，找到 Tomcat 的位置，打開 conf 文件夾，找到配置文件 server.xml ；
在 Host 標籤裏添加一行 <Context docBase="D:\orderBomFile\" path="/file" reloadable="true"/>
docBase代表文件存放的位置，path代表的是虛擬路徑，跟上面一樣，到時在 a 標籤的 href 屬性配置“ /file/order/a.png ” 瀏覽器就不會攔截了。同樣，保存後要重啓服務器！
（3）最終代碼
<body>
<h1>小白學習</h1>
<a href="/file/order/a.png">預覽1</a><br>
<a href="/file/order/c.pdf">預覽2</a><br>
<button onclick="openImage()">預覽3</button>
<button onclick="openPdf()">預覽4</button>
<script type="text/javascript">
function openImage(){
window.open("/file/order/a.png");
}
function openPdf(){
window.open("/file/order/c.pdf");
}
</script>
</body>
三、補充
這種方式可以實現圖片和PDF文檔的簡單預覽，換做其他格式的文件就變成直接下載了，比如 doc、docx、pptx等。