將現有的img轉換為base64

Question

我正在尋找一種優雅的方法來將文檔上的現有<img>轉換為base64加載的<img> 。 因此，只需將src url轉換為base64數據即可。

最好的方法是什么？

Answer 1

我設法做到了！ （我遇到了同樣的問題。）在下面的代碼中， img是圖像DOM元素：

var canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
img.crossOrigin = "anonymous";
canvas.getContext('2d').drawImage(img, 0, 0);
var dataUrl = canvas.toDataURL('image/png');

這行img.crossOrigin = "anonymous"; 盡管我不確定這是否是“ hack”並且可能會在某些時候“修復”，但由於我不完全了解此處的CORS問題，因此它有助於以某種方式繞過CORS。