在做项目的时候,会遇到很多下载的功能,有时候我们点击按钮或者图片就在浏览器新打开一个tab预览或者右键才能保存,当前需求是点击按钮实现图片的自动下载。
原生js实现:
/** * name: 图片下载后的名字 * url:图片的地址 */ function downLoadImg(name, url) { var image = new Image(); image.setAttribute('crossOrigin', 'anonymous'); image.onload = function () { var canvas = document.createElement('canvas'); canvas.width = image.width; canvas.height = image.height; var ctx = canvas.getContext('2d'); ctx.drawImage(image, 0, 0, image.width, image.height); var url = canvas.toDataURL('image/png'); var a = document.createElement('a'); a.download = name; a.href = url; a.click(); }; image.src = url; }