身为一个web前端开发者,总会遇到在手机浏览器端下载图片的需求。
以下方法可实现安卓下载到相册和文件管理,苹果下载到文件管理。
现总结如下:
-
将base64解码转换成blob对象(注意,如果直接下载base64格式,在安卓机上无法正常下载)
-
将blob对象封装到a标签中置入页面
-
模拟点击这个a标签触发下载请求
function downloadBase64(base64, fileName) {
var arr = base64.split(',');
var bytes = atob(arr[1]);
let ab = new ArrayBuffer(bytes.length);
let ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
var blob = new Blob([ab], { type: 'application/octet-stream' });
var url = URL.createObjectURL(blob);
var a = document.createElement('a');
a.href = url;
a.download = fileName + '.png';
var e = document.createEvent('MouseEvents');
e.initMouseEvent(
'click',
true,
false,
window,
0,
0,
0,
0,
0,
false,
false,
false,
false,
0,
null
);
a.dispatchEvent(e);
URL.revokeObjectURL(url);
}