一、背景
为了实现简单的文件预览功能。
二、实现过程
（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 οnclick="openImage()">预览3</button>
<button οnclick="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等。
