Sometimes, we want to get binary (base64) data from HTML5 canvas with JavaScript.
In this article, we’ll look at how to get binary (base64) data from HTML5 canvas with JavaScript.
How to get binary (base64) data from HTML5 canvas with JavaScript?
To get binary (base64) data from HTML5 canvas with JavaScript, we can use the canvas toDataURL method.
For instance, we write
const jpegUrl = canvas.toDataURL("image/jpeg");
const pngUrl = canvas.toDataURL();
to call toDataURL with the MIME type of the image to return.
The canvas data will be returned as a base64 string.
If no argument is set, then a PNG image base64 string is returned.
Conclusion
To get binary (base64) data from HTML5 canvas with JavaScript, we can use the canvas toDataURL method.
