JS - lấy chiều rộng và chiều cao hình ảnh từ mã base64

Tôi có một base64 img được mã hóa mà bạn có thể tìm thấy ở đây . Làm thế nào tôi có thể có được chiều cao và chiều rộng của nó?

var i = new Image(); 

i.onload = function(){
 alert( i.width+", "+i.height );
};

i.src = imageData; 

Để sử dụng đồng bộ, chỉ cần gói nó thành một lời hứa như sau:

function getImageDimensions(file) {
  return new Promise (function (resolved, rejected) {
    var i = new Image()
    i.onload = function(){
      resolved({w: i.width, h: i.height})
    };
    i.src = file
  })
}

thì bạn có thể sử dụng await để lấy dữ liệu theo kiểu mã hóa đồng bộ:

var dimensions = await getImageDimensions(file)

Tôi thấy rằng sử dụng .naturalWidthvà .naturalHeightcó kết quả tốt nhất.

const img = new Image();

img.src = 'https://via.placeholder.com/350x150';

img.onload = function() {
  const imgWidth = img.naturalWidth;
  const imgHeight = img.naturalHeight;

  console.log('imgWidth: ', imgWidth);
  console.log('imgHeight: ', imgHeight);
};

Điều này chỉ được hỗ trợ trong các trình duyệt hiện đại. http://www.jacklmoore.com/notes/naturalwidth-and-naturalheight-in-ie/

Tạo một ẩn <img>với hình ảnh đó và sau đó sử dụng jquery .width () và. Chiều cao()

$("body").append("<img id='hiddenImage' src='"+imageData+"' />");
var width = $('#hiddenImage').width();
var height = $('#hiddenImage').height();
$('#hiddenImage').remove();
alert("width:"+width+" height:"+height);

Kiểm tra ở đây: FIDDLE

Hình ảnh ban đầu không được tạo ẩn. nó được tạo, sau đó bạn nhận được chiều rộng và chiều cao rồi xóa nó. Điều này có thể gây ra khả năng hiển thị rất ngắn trong các hình ảnh lớn, trong trường hợp này, bạn phải bọc hình ảnh trong một vùng chứa khác và làm cho vùng chứa đó bị ẩn chứ không phải chính ảnh.

Một Fiddle khác không thêm vào dom theo anser của gp.: TẠI ĐÂY