前端JS通过Ajax下载后端返回的Excel文档

我们来看下效果演示：
条件假设：

首先得有一个下载文档的接口，我们假设这个接口的地址是myurl
其次我们一般使用token来区分用户是否有权下载，假设令牌为token

html部分比较简单

<button type="button" id="test">下载</button>

JS部分（这里假设你引用了jquery）

$(function() {function download(filename) {var oReq = new XMLHttpRequest();oReq.open("GET", myurl, true); /*链接地址后续要修改,改成你要下载的文档地址，也就是接口地址*/oReq.responseType = "blob";oReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); oReq.setRequestHeader("Authorization",token); /*token为身份令牌，看你的接口是否需要，若不需要删除这一行即可*/oReq.onload = function (oEvent) {var content = oReq.response;var elink = document.createElement('a');elink.download = filename;elink.style.display = 'none';  var blob = new Blob([content], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}); /*type的这个定义文档下载为excel格式*/elink.href = URL.createObjectURL(blob);document.body.appendChild(elink);elink.click();document.body.removeChild(elink);};oReq.send();}$(document).on("click", "#test", function() {download("test");
}

参考文章：

实际结果问题的：
https://www.cnblogs.com/sunweinan/p/excel.html
https://www.cnblogs.com/soyxiaobi/p/9362516.html
解释的很清楚的：
https://www.zhangxinxu.com/wordpress/2017/07/js-text-string-download-as-html-json-file/

前端JS通过Ajax下载后端返回的Excel文档相关推荐

前端用 js-file-download组件下载后端返回的Excel文件
后端接口返回的Excel的文件流需要导出让浏览器下载文件一.先安装 js-file-download组件 npm install js-file-download --save 二.在对应使用的页面 ...
vue怎么显示/下载后端返回的 .docx文档
需求: 后端给了一个.docx 文档的url地址,前端要在页面显示或下载这个文档比如地址是xxx.docx 参考文章:前端预览word文档实现_前端打开word文档_何以为皇的博客-CSDN博客上 ...
ie浏览器下载门户网站的excel文档出现乱码现象的解决办法
1.有时候我们部署的网站的相关下载链接通过ie浏览器下载xls文档打开会出现乱码现象. 2.解决方法: 2.1 在部署包web.xml文档中加入如下配置: <!-- ie xls文件直接打开乱码 ...
vue项目中实现下载后端返回的excel数据表格
查看更多资源 1. 案例简介: vue项目中,客户端需要实现以excel表格形式下载数据,后端为java,接受请求 >> 读取数据库 >> 生成excel >> 返 ...
前端 js jQuery ajax实现文件流下载, 下载doc,xsl等文件内容乱码问题
问题描述: 前端通过jQuery ajax接受后端的文件流,前端下载文件后内容乱码后端代码: Header("Content-type: application/octet-stream& ...
webApi前端ajax调用后端返回{“readyState“:0,“status“:0,“statusText“:“error“}解决方案
webApi前端ajax调用后端返回{"readyState":0,"status":0,"statusText":"error& ...
前端处理后端返回的excel文件流并下载
项目中遇到上传excel,后端写的接口是当重复上传相同信息的excel时会吐出excel二进制文件流,这种文件流需要前端下载供用户看. 首先后端的接口需要上传文件已formData形式上传这里我用的 ...
用ajax下载字节流形式的excel文件
原因:ajax请求只是个"字符型"的请求,即请求的内容是以文本类型存放的.文件的下载是以二进制形式进行的,ajax没法解析后台返回的文件流,所以无法处理二进制流response输出 ...
JAVA毕业设计vue.js开发红酒网站计算机源码+lw文档+系统+调试部署+数据库
JAVA毕业设计vue.js开发红酒网站计算机源码+lw文档+系统+调试部署+数据库 JAVA毕业设计vue.js开发红酒网站计算机源码+lw文档+系统+调试部署+数据库本源码技术栈: 项目架构:B ...

前端JS通过Ajax下载后端返回的Excel文档

前端JS通过Ajax下载后端返回的Excel文档相关推荐

最新文章

热门文章