Bootstrap

使用a标签,点击自动下载文件(Excel),不做页面跳转

记录下最近项目中遇到的问题

知识点:

编码:防止乱码

escape不编码字符有69个:*,+,-,.,/,@,_,0-9,a-z,A-Z

encodeURI不编码字符有82个:!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z

encodeURIComponent不编码字符有71个:!, ',(,),*,-,.,_,~,0-9,a-z,A-Z

encodeURI() 函数可把字符串作为 URI 进行编码,字符将被十六进制的转义序列进行替换 decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码

请求方式:

a标签默认请求方式是get请求

最主要的设置响应头,即使没有点击事件做处理

响应由设置正确了,点击a标签后也不会跳转页面

注意:没有设置响应头,点击a会把href中的地址当成页面路径,这是不对的,直接跳转会报404错误,这是找不到对应地址的页面

关键部分:设置响应头

注意到第一个值项是attachment,这是真正的关键,设定了这个值,浏览器就会老老实实地显示另存为对话框

如果这个值设成inline,则无论怎样浏览器都会自动尝试用已知关联的程序打开文件

// 1. 使客户端浏览器,区分不同种类的数据,以及编码方式
response.setContentType("text/xml;charset=UTF-8");
// 2. 强制浏览器下载
response.setHeader("content-disposition", "attachment;filename=" + 文件名 + 后缀);
// 3. 设置传输的文件大小
response.setHeader("Content-Length",文件长度.toString() / 文件长度 + "");   // 注意:这里length要传入字符串类型
​
​
​
// 浏览器尝试打开,支持office online或浏览器预览pdf功能
response.setHeader("content-disposition", "inline;filename=" + realName);

打开新页面:

target="_blank"

解决方案:

前端页面

页面:a标签,配置下载路径

<a href="下载路径">点击下载</a>

后端部分

Controller:

1.获取需要写入Excel的数据

2.数据处理

3.写入Excel

4.设置响应头(编码方式,文件类型。。。)

5.开始传入
    OutputStream os = response.getOutputStream();
    os.write(Excel文件);
    os.close();

;