<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>nick getBase64</title>
</head>
<body>
<div>
<button id="downloadImg">下载</button>
</div>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
//下载图片
document.getElementById('downloadImg').addEventListener('click', function () {
getUrlBase64('base64-url').then(function(base64) {
let link = document.createElement('a')
link.href = base64
link.download = 'qrCode.png'
link.click()
})
})
function getUrlBase64(url) {
return new Promise(resolve => {
let canvas = document.createElement('canvas')
let ctx = canvas.getContext('2d')
let img = new Image()
img.crossOrigin = 'Anonymous' //允许跨域
img.src = url
img.onload = function() {
canvas.height = 300
canvas.width = 300
ctx.drawImage(img, 0, 0, 300, 300)
let dataURL = canvas.toDataURL('image/png')
canvas = null
resolve(dataURL)
}
})
}
</script>
</body>
</html>