base64编码后的文件地址过长导致a标签失效

做了一个Excel导出功能，因为要导出5W+条数据，刚开始是因为处理超时，就提高了nginx的超时时间
proxy_connect_timeout 300s;
proxy_send_timeout 300s;
proxy_read_timeout 300s;
不超时了之后又内存溢出了，查了之后就加了运行内存
-Xms256m -Xmx1024m
好不容易数据传到了前台，却发现没反应，经过两天时间的思考，写下下面的内容。

如果使用base64作为a标签的href值，可以用来接收较短的base64编码后的数据源，但是当数据量较大时，会导致a标签的click()事件失效.

我猜测是因为这个点击事件是进行页面跳转的，所以herf作为URL时过长，超出了浏览器的限制。当数据小的时候可以正常跳转进行下载

var url = "你的后台请求url";var xhr = new XMLHttpRequest();xhr.open('post', url, true);        // 也可以使用POST方式，根据接口xhr.setRequestHeader("Authorization", sessionStorage.getItem("sessionId"));xhr.responseType = "blob";    // 返回类型blobxhr.onload = function () {if (this.status === 200) {var blob = this.response;var reader = new FileReader();reader.readAsDataURL(blob); reader.onload = function (e) {// 转换完成，创建一个a标签用于下载var fileName = xhr.getResponseHeader("Content-Disposition").split(";")[1].split("filename=")[1];       //放在response header里的fileNamevar a = document.createElement('a');a.download = decodeURI(fileName);  //文件名a.href = URL.createObjectURL(dataURLToBlob(e.target.result));$("body").append(a);    // 修复firefox中无法触发clicka.click();$(a).remove();}}};xhr.send();

function dataURLToBlob(dataurl) {var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);while(n--){u8arr[n] = bstr.charCodeAt(n);}return new Blob([u8arr], {type:mime});
}

上面的代码就是改了之后的，将base64转为blob，再通过URL.createObjectURL()就可以赋值给a标签了，记下来以备以后需要

base64编码后的文件地址过长导致a标签失效相关推荐

c/c++ base64编码后，通过php解码，中文乱码解决办法
1. c/c++ base64编码后的内容为: $base64_encode="IMf9tq/G9yBEINbQtcS+7crHIExFTk9WTwogvu21xNDywdC6xcrHIDU ...
nmmqq.php?/lspc.html,html中的图片直接使用base64编码后的字符串代替详解
网页中的图片是使用base64编码后的字符串代替了,这个叫做Data URI scheme,下面有个不错的示例,大家可以参考下最近来了一个网页,里面有图片,但是却没有引用外部的图片资源,很好奇.查看 ...
java上传图片特征码到服务器,记一个Base64编码后经网络传输产生的问题
问题:机器特征码经过网络传输之后,'+'都变成了' ' 详情:机器特征码提取了机器cpuId和mac地址信息,最后经过Base64编码后生成的字符串,一开始我使用的是 String strs = ne ...
linux jpg图片转base64,html中的图片直接使用base64编码后的字符串代替
最近来了一个网页,里面有图片,但是却没有引用外部的图片资源,很好奇.查看代码后发现,里面的图片是使用base64编码后的字符串代替了,这个叫做Data URI scheme. Data URI sch ...
html5 sfbapa cn,html中的图片直接使用base64编码后的字符串代替
html中的图片直接使用base64编码后的字符串代替发布时间:2020-03-03 来源:未知点击: 次最近来了一个网页,里面有图片,但是却没有引用外部的图片资源,很好奇.查看代码后发现,里面 ...
base64编码后的图片如何获取它的宽和高
具体获取宽和高的方法: 前端传过来的是base64编码后的图片具体代码如下:(不适合直接copy,可以简单看一下,很简单) public com.tfiir.srl.framework.Respon ...
图片转换为base64编码后，实现无图片展示图片
第一部分,将图片转换为base64编码输出为txt文本第二部分,将转换出来的base64编码赋值给b64_code,通过base64编码转换为图片,打开,然后删除 base64编码过长,同时输入过多 ...
mysql base64 乱码_PHP base64编码后解码乱码的解决办法
在用PHP做东西的时候发现了一个问题,可以简单的归结为乱码的问题,但是这个问题不是函数本身造成的.来看看罪魁祸首是谁. 嫌疑人:base64_encode 和 base64_decode 罪行:我写了 ...
将图片进行base64 编码后的数据进行读取，以io流的方式传给前台并显示出来并且不断刷新图片
前提摘要:最近做一个项目,是关于slam的,给slam发送构建地图的命令,slam不断返回json串,而地图的图片在json串中已经经过base64编码了,我这边需要将base64编码解析并以流的方式 ...

base64编码后的文件地址过长导致a标签失效

base64编码后的文件地址过长导致a标签失效相关推荐

最新文章

热门文章