文档的打开与下载

环境介绍

前后端分离，前端vue，后台springboot。

文件放置位置

位置1：

放在前端服务器，如/static/文件夹下。
（优缺点：方便管理，无需接口调用；但是安全性不高，直接输入文件位置即可访问；适用于安全性要求不高，无需动态修改文件内容的指定文件。）

位置2：

放在后台服务器，指定位置或者jar包中。
（优缺点：需要后台提供接口调用，安全性高，可校验用户权限后在确认打开或下载文件；适用于安全性有要求，需要动态修改文件内容的文件。）

打开还是下载

前端浏览器

通常情况下浏览器只支持.pdf格式，可以直接打开在线预览，再下载。
如果是.xls等格式，默认直接下载，且无法修改名字和路径。

后台接口调用

若调用后台接口打开.pdf格式文件，打开还是下载取决于返回消息头的设置。

// 直接下载文件
response.addHeader("Content-Disposition", "attachment;fileName=" + fileName); // fileName设置文件名
// 在浏览器端直接打开文件
response.addHeader("Content-Disposition", "inline;fileName=" + fileName); // fileName设置文件名

方法一（前端在线打开静态资源文件）

1、a标签，点击下载

<a href="/static/用户手册.pdf" target="_black">文档的打开与下载</a>

若有属性download=“filename”，强制下载，若无，根据target属性判断如何打开。

但是官方也说了只有 Firefox 和 Chrome 支持 download 属性。
详见文档：http://www.w3school.com.cn/tags/att_a_download.asp
若要考虑兼容性咋办呢，尝试了半天好像也没什么结果。
只能通过接口调用解决，详见另一篇文章：https://blog.csdn.net/Beam007/article/details/83893229

常用target属性如下：
target="_self"，默认。在相同的框架中打开被链接文档。
target="_blank"，在新窗口中打开被链接文档。

2、embed标签，嵌入页面

<embed src="/static/用户手册.pdf">

IE不支持，需要搭配object等一系列标签使用。

3、iframe标