Estoy intentando actualizar img desde src=@string, el navegador guarda la caché de imágenes y luego dibujo la primera imagen constantemente, pero quiero actualizar la imagen dinámicamente, desde la matriz de bytes. Desactivo la función de guardar caché, y luego ya no se dibuja nada, pero puedo actualizar @string y escribirlo en la consola, donde veo que la cadena se actualizó. También debería decir que puedo actualizar la imagen cuando uso el evento onclick, pero no es lo que quiero.

Mi código

 @page "/" @inject IJSRuntime JsRuntime; <div> <img src="@Image64" @ref="imageRef" hidden/> </div> <div id="canvasHolder" style="position: fixed; width: 100%; height: 100%"> <BECanvas Width="1000" Height="1000" @ref="CanvasRef"></BECanvas> </div> @code{ protected BECanvasComponent CanvasRef; ElementReference imageRef; Canvas2DContext ctx; public string Image64 = "100"; Random rand = new Random(); PngFormat pngFormat = PngFormat.Instance; byte[] arr = new byte[2000000]; Image<Rgba32> map; int countX = 0; int countY = 0; protected override async Task OnAfterRenderAsync(bool firstRender) { this.ctx = await CanvasRef.CreateCanvas2DAsync(); await JsRuntime.InvokeAsync<object>("initRenderJS", DotNetObjectReference.Create(this)); await base.OnInitializedAsync(); } protected override async Task OnInitializedAsync() { System.Console.WriteLine("Mario"); Image64 = "data:image/png;base64,.."; //+ "?nocache=<?php echo time(); ?>"; } [JSInvokable] public async ValueTask RenderInBlazor(float timeStamp) { countX += 15; countY += 10; await this.ctx.ClearRectAsync(0, 0, 1000, 1000); rand.NextBytes(arr); System.Console.WriteLine("1"); Image64 = Convert.ToBase64String(arr); //+ "?nocache=<?php echo time(); ?>"; await this.ctx.DrawImageAsync(imageRef, countX, countY, 400, 400); } }