JS 将 Canvas 转换为 Blob 或 Image

用 js 将 canvas 转换为 blob 或者 image

Image

MDN - toDataURL

canvas.toBlob(function (blob) {
  link.href = URL.createObjectURL(blob);
  console.log(blob);
  console.log(link.href); // this line should be here
}, 'image/png');

• https://stackoverflow.com/questions/10673122/how-to-save-canvas-as-an-image-with-canvas-todataurl

var image = canvas
  .toDataURL('image/png')
  .replace('image/png', 'image/octet-stream'); // here is the most important part because if you dont replace you will get a DOM 18 exception.
window.location.href = image; // it will save locally

• https://stackoverflow.com/questions/11112321/how-to-save-canvas-as-png-image

var canvas = document.getElementById('alpha');
var dataURL = canvas.toDataURL('image/png');
var newTab = window.open('about:blank', 'image from canvas');
newTab.document.write("<img src='" + dataURL + "' alt='from canvas'/>");

var canvas = document.getElementById('my-canvas');
// draw to canvas...
canvas.toBlob(function (blob) {
  saveAs(blob, 'pretty image.png');
});

downloadjs

• https://www.npmjs.com/package/downloadjs

import download from 'downloadjs';
download(data, strFileName, strMimeType);