Ich habe eine asp.net Web App.

Ich verwende Web-Sockets und HTML5 / Canvas, um Bilder auf meiner Webseite zu rendern.

Dies ist der JS dafür:

function setUpImageProc() {
    desktopImage.onload = function () {
      ctxLiveViews.drawImage(desktopImage, 0, 0, 360, 240);
    }
}


var desktopImage = new Image;

ws.onmessage = function (e) {
    desktopImage.src = 'data:image/jpeg;base64,' + arrayBufferToBase64(e.data);
};  

setUpImageProc();           


var canvasLiveViews = document.getElementById("canvasLiveView1");
ctxLiveViews = canvasLiveViews.getContext("2d");
canvasLiveViews.width = 360;
canvasLiveViews.height = 240;

Now das hat funktioniert.
Es funktioniert nicht mehr in Chrome
Es funktioniert in Edge
Wenn ich die Hardwarebeschleunigung deaktiviere, funktioniert das
Wenn ich @ benut<img> Anstatt von<canvas> es wird klappen

Ich denke, das liegt an einem Upgrade des Chrome-Browsers, aber ich bin überrascht, dass sich noch niemand darüber beschwert hat?

Ist mein obiges JS-Skript korrekt oder falsch eingestellt?

Additional Points: Es gibt keine Konsolenmeldungen

Der onMessage-Handler feuert auf jeden Fall

Ich habe die onLoad-Funktion umbrochen, da sie in einer externen Datei gespeichert ist und ich Probleme beim Laden dieses Skripts in meine Seite hatte. Indem ich das tat, was ich getan hatte, schien ich das Problem zu lösen, obwohl ich weiteren Code posten müsste, um dies zu demonstrieren.

Ich habe versucht, die Zeichenfläche direkt zu laden, anstatt das onLoad-Ereignis @ zu verwende