javascript video önizleme Hk. yardım

if(data.hasOwnProperty('video')){
html += '<div class="mediaItem">';
html += '<video controls class="img-fluid">';
html += '<source src="' + data.video + '" type="video/mp4">';
html += 'Tarayıcınız video etiketini desteklemiyor.';
html += '</video>';
html += '<a href="' + data.video + '" download class="btn btn-primary downloadButton">Videoyu İndir</a>';
html += '</div>';
// Videonun önizleme görselini oluştur
$("video").on('loadeddata', function() {
var video = $("video")[0];
var canvas = document.createElement('canvas');
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);
var dataURL = canvas.toDataURL();
$('#previewImage').attr('src', dataURL).show();
});
}



bu şekilde sunucuya kayıtlı olan videoyu çekip html ile ekranda gösteriyorum, fakat video önizleme çalışmıyor sayfa açıldığında sadece üçgen video oynatma butonu var bir kez videoyu oynatıp kağattığımda önizleme geliyor, sorun, sayfa ilk açıldığında videoyu oynatmaya gerek kalmadan video önizlemesi gözüksün

https://stackoverflow.com/a/65862639/14239903

hocam video linkini dinamik olarak almaktayım nasıl bir yol izlemeliyim