做了一個(gè)Excel導(dǎo)出功能，因?yàn)橐獙?dǎo)出5W+條數(shù)據(jù)，剛開始是因?yàn)樘幚沓瑫r(shí)，就提高了nginx的超時(shí)時(shí)間
proxy_connect_timeout 300s;
proxy_send_timeout 300s;
proxy_read_timeout 300s;
不超時(shí)了之后又內(nèi)存溢出了，查了之后就加了運(yùn)行內(nèi)存
-Xms256m -Xmx1024m
好不容易數(shù)據(jù)傳到了前臺(tái)，卻發(fā)現(xiàn)沒反應(yīng)，經(jīng)過兩天時(shí)間的思考，寫下下面的內(nèi)容。

如果使用base64作為a標(biāo)簽的href值，可以用來接收較短的base64編碼后的數(shù)據(jù)源，但是當(dāng)數(shù)據(jù)量較大時(shí)，會(huì)導(dǎo)致a標(biāo)簽的click()事件失效.

我猜測(cè)是因?yàn)檫@個(gè)點(diǎn)擊事件是進(jìn)行頁(yè)面跳轉(zhuǎn)的，所以herf作為URL時(shí)過長(zhǎng)，超出了瀏覽器的限制。當(dāng)數(shù)據(jù)小的時(shí)候可以正常跳轉(zhuǎn)進(jìn)行下載

var url = "你的后臺(tái)請(qǐng)求url";var xhr = new XMLHttpRequest();xhr.open('post', url, true); // 也可以使用POST方式，根據(jù)接口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) {// 轉(zhuǎn)換完成，創(chuàng)建一個(gè)a標(biāo)簽用于下載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); // 修復(fù)firefox中無法觸發(fā)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轉(zhuǎn)為blob，再通過URL.createObjectURL()就可以賦值給a標(biāo)簽了，記下來以備以后需要

總結(jié)

以上是生活随笔為你收集整理的base64编码后的文件地址过长导致a标签失效的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。