шив / шим / ганьба
Якщо ваші зображення вже завантажені (чи ні), цей "інструмент" може стати в нагоді:
Object.defineProperty
(
HTMLImageElement.prototype,'toDataURL',
{enumerable:false,configurable:false,writable:false,value:function(m,q)
{
let c=document.createElement('canvas');
c.width=this.naturalWidth; c.height=this.naturalHeight;
c.getContext('2d').drawImage(this,0,0); return c.toDataURL(m,q);
}}
);
.. але чому?
Це має перевагу у використанні "вже завантажених" даних зображень, тому зайвий запит не потрібен. Aditionally це дозволяє кінцевому користувачеві (програмісту , як ви) приймає рішення про CORS і / або mime-type
і quality
-або- Ви можете залишити ці аргументи / параметри , як описано в MDN описі тут .
Якщо у вас цей JS завантажений (до того, коли це потрібно), то перетворення в dataURL
такий же простий, як:
приклади
HTML
<img src="/yo.jpg" onload="console.log(this.toDataURL('image/jpeg'))">
JS
console.log(document.getElementById("someImgID").toDataURL());
Відбитки пальців графічного процесора
Якщо вас турбує "точність" бітів, ви можете змінити цей інструмент відповідно до ваших потреб, як це передбачено у відповіді @ Kaiido.