一、问题：
开发中遇到下载exel文档；后端小哥返回来base64位的exel文件；刚开始文件比较小；本人使用创建a标签给href纸箱base64位文件
var a = document.createElement('a'); a.download = fileName; var blobExel = e.target.result;//base64位文件 a.setAttribute('href',URL.createObjectURL(blobExel));该方法在遇到下载文件超过2M左右文件的时候会在（IE、chrome等）很多浏览器下载失败
二、下载失败原因
经过认真对比，发现这个是各个浏览器对URL长度限制不同导致的；于是收集了各个浏览器的限制标准 IE 最大长度限制为2048字节 Chrome 最大长度限制为8182字节 Firefox 最大长度限制为65536字节 Safari 最大长度限制为80000字节 Opera 最大长度限制为190000字节
三、解决方案
后端返回的文件过大，长度过长导致了下载失败的问题；那就把href的长度变短点；把base64位文件转换成exel文件之后再把href只想该文件；废话不多说上代码
baseExel:function (base64) { /*处理后端返回的base64位文件变成exel文件进行下载 * 不要直接把base64位的exel文件直接给a标签的href， * 文件过大时base64位长度过长；chrome浏览器对a标签的href长度有限制；导致下载失败； * 建议用以下方法处理成本地文件再下载 * */ function getContentType(base64) { return /data:([^;]*);/i.exec(base64)[1]; }; function getData(base64) { return base64.substr(base64.indexOf("base64,") + 7, base64.length); }; function b64toBlob(b64Data, contentType, sliceSize) { contentType = contentType || ''; sliceSize = sliceSize || 512; var byteCharacters = atob(b64Data); var byteArrays = []; for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) { var slice = byteCharacters.slice(offset, offset + sliceSize); var byteNumbers = new Array(slice.length); for (var i = 0; i < slice.length; i++) { byteNumbers[i] = slice.charCodeAt(i); } var byteArray = new Uint8Array(byteNumbers); byteArrays.push(byteArray); } var blob = new Blob(byteArrays, { type: contentType }); return blob; }; return b64toBlob(getData(base64), getContentType(base64)); }, var a = document.createElement('a'); var file=e.target.result; a.download = fileName; var blobExel = self.baseExel(e.target.result); //把base64位文件转化为exel文件 a.setAttribute('href',URL.createObjectURL(blobExel)); $("body").append(a); // 修复firefox中无法触发click a.click(); $(a).remove();把base64位文件转化成exel文件后下载就缩短了href的URL长度完美解决问题
