Blazor NET8 localStorage getItem gives IJSRuntime error or disconnects from server

I am updating a Blazor hosted web app from net6 to a Blazor Web App in net8, and have been unable to retrieve an item from local storage. I can successfully SET the item in localStorage, and after I set it, I want to retrieve it. But on GET item I get the IJSInProcessRuntime not available error (in other variations of my code I become disconnected from the server). A similar stackoverflow question included this response: " you can just use the OnAfterRender hook and use StateHasChanged" , which I thought I was doing: since the IJS runtime is not available until after the page has rendered, my GetItem is now in the OnAfterRenderAsync method, and I am using StateHasChanged once I have set my GetImageBool trigger to true to get the item. I have tried different rendermodes, with and without prerendering, and get the same error. Per the Microsoft docs, I've moved my "SET" javascript (which works) to MyAssemblyName.lib.module.js. I tried a workaround to have eventArgsCreator also return the item instead of only saving it in localstorage, however, an async method is required to to create the saved value ("thisimage" is a Base64string), and the app crashes on load when I set eventArgsCreator to be an async function (to await the call to funcLocal). Program.cs correctly contains builder.Services.AddBlazoredLocalStorage(); What am I missing?

Set the value in localStorage: MyAssemblyName.lib.module.js:

    blazor.registerCustomEventType('pastemultimedia', {        browserEventName: 'paste',        createEventArgs: eventArgsCreator    });   } function eventArgsCreator(event) {    console.log("In processPasteEvent");    const items = event.clipboardData.items;    const acceptedMediaTypes = ["image/png"];    let isMultimedia = false;    let data = null;    let file = null;    for (let i = 0; i < items.length; i++) {        file = items[i].getAsFile();        if (!file) continue;        if (!items[i].type.includes('image')) continue;        if (acceptedMediaTypes.indexOf(items[i].type) === -1) continue;        isMultimedia = true;        data = URL.createObjectURL(file);        funcLocal(file);        break;    }    return {        IsMultimedia: true,        Data: data    };}async function funcLocal(fileParam) {    const result = await blobToBase64(fileParam);    console.log(`Saving to local storage: ${result.substring(0, 100)}`); // Display first 100 chars for brevity    localStorage.setItem("thisimage", result);    return result;}

Blazor page:

@page "/stackoverflow"@inject IJSRuntime JS@inject Blazored.LocalStorage.ISyncLocalStorageService localStorage@rendermode @(new InteractiveServerRenderMode(prerender: false))@if (GetImageBool && !string.IsNullOrEmpty(Image)){    @Image<img src="@Image" />}<input id="textarea"               Title="Right-click to Paste Image from Snipping Tool"               @onpastemultimedia="HandlePasteMultimedia"               class="pasteimagearea"               style=@($"visibility:{(SavingImage ? "hidden" : "visible")}") /><style>    .pasteimagearea {        background: url(images/PASTEIMAGE.png) center center no-repeat;        width: 50vw;        height: 50vh;    }</style>@code {    public bool SavingImage { get; set; } = false;    public string Image { get; set; } = "";    private bool GetImageBool { get; set; } = false;    protected override async Task OnAfterRenderAsync(bool firstRender)    {        if (GetImageBool)        {// THIS IS LINE 48 WHICH TRIGGERS THE ERROR:            var thisvar = localStorage.GetItemAsString("thisimage");              Image = thisvar;        }    }    public async Task HandlePasteMultimedia(PasteMultimediaEventArgs e)    {                         SavingImage = true;            GetImageBool = true;            StateHasChanged();             }}

Custom Event / Argument definition:

 public class PasteMultimediaEventArgs : EventArgs {     public bool IsMultimedia { get; set; }     public string? Data { get; set; } } [EventHandler("onpastemultimedia", typeof(PasteMultimediaEventArgs), enableStopPropagation: true, enablePreventDefault: true)] public static class EventHandlers { }

Complete error message:

[2024-07-15T14:00:19.626Z] Error: System.AggregateException: One or more errors occurred. (IJSInProcessRuntime not available) ---> System.InvalidOperationException: IJSInProcessRuntime not available   at Blazored.LocalStorage.BrowserStorageProvider.CheckForInProcessRuntime()   at Blazored.LocalStorage.BrowserStorageProvider.GetItem(String key)   at Blazored.LocalStorage.LocalStorageService.GetItemAsString(String key)   at MyAssemblyName.Client.Pages.StackOverflowComponent.OnAfterRenderAsync(Boolean firstRender) in C:\MyAssemblyName\MyAssemblyName.Client\Pages\StackOverflowComponent.razor:line 48