domtoimage.toBlob(targetDom, options)
.then(function (blob) {
// console.log('dataUrl', dataUrl)
// var link = document.createElement('a');
// link.download = 'my-image-name.png';
// link.href = dataUrl;
// link.click();
blob.arrayBuffer().then(
arrayBuffer=> {
var decoded = UPNG.decode(arrayBuffer)
var rgba8 = UPNG.toRGBA8(decoded)
var compressed = UPNG.encode(
rgba8,
decoded.width,
decoded.height,
32767*0.85
)
function arrayBufferToBase64(buffer) {
var binary = '';
var bytes = new Uint8Array(buffer);
var len = bytes.byteLength;
for (var i = 0; i < len; i++) {
binary += String.fromCharCode(bytes[i]);
}
// 对二进制数据进行base64编码
return btoa(binary);
}
// var blobDest = new Blob([compressed], {type: 'image/png'});
const base64Str = 'data:image/png;base64,' +arrayBufferToBase64(compressed);
callback(base64Str);
}
);
})
.catch(function (error) {
console.error('oops, something went wrong!', error);
alert("toPng: "+error);
});
https://github.com/tsayen/dom-to-image/
<script src="https://cdn.staticfile.net/pako/1.0.5/pako.min.js"></script>
<script src="https://cdn.staticfile.net/upng-js/2.1.0/UPNG.min.js"></script>