html5 canvas 載入圖片URL並轉換成base64
阿新 • • 發佈:2019-02-04
非同步載入圖片到canvas並拿掉data:image;base64部分。
function convertImgToBase64(url, callback, outputFormat){ var img = new Image(); img.crossOrigin = 'Anonymous'; img.onload = function(){ var canvas = document.createElement('CANVAS'); var ctx = canvas.getContext('2d'); canvas.height = this.height; canvas.width = this.width; ctx.drawImage(this,0,0); var dataURL = canvas.toDataURL(outputFormat || 'image/png'); dataURL = dataURL.replace(/^data:image\/(png|jpg|jpeg);base64,/, ""); callback(dataURL); canvas = null; }; img.src = url; } convertImgToBase64(imgQrCode.src, function(base64Img){ console.log('base64 :',base64Img); });