從Base64編碼的圖像獲取尺寸

Question

我有一個Angular應用程序，我需要Base64編碼圖像的尺寸。 我試圖將其加載到Image但它只是說它是0x0

const image = new Image();
image.src = 'data:image/jpeg;base64,someBase64ImageString';

console.log(image.width + 'x' + image.height);

我不知道如何獲取此信息。

Answer 1

設置src和將圖片置於“已加載”狀態（因此具有尺寸）之間的步驟是異步的-這似乎適用於數據URI和外部資源（至少在Chrome中是這樣）。

為了安全地確保填充了width和height ，應該在回調中運行邏輯-即

let im = new Image;
im.src = 'data:image/png;base64,whatever';
im.onload = () => console.log(im.width);

請注意，這僅是第一次加載圖像時的問題，您的代碼可按原樣工作以進行后續調用-大概與瀏覽器處理和緩存數據的方式有關。

Answer 2

確保在src之前添加data:image/png;base64,

所以應該

img.src= 'data:image/png;base64,' + b64string;