Blazor Server（.NET 9）OnAfterRenderAsync无法触发JS互操作求助

我正在开发基于.NET 9.0的Blazor Server应用，在集成Algolia InstantSearch等外部库前，先尝试基础JavaScript互操作，但遇到了以下问题。

当前代码配置 #

interop.js #

window.showAlert = function (message) {
    alert(message);
};

App.razor #

<body>
    <Routes />
    <script src="_framework/blazor.web.js"></script>
    <script src="_framework/blazor.server.js"></script>
    <script src="js/interop.js"></script>
</body>

interop.razor #

@page "/interop"
@inject IJSRuntime JS

<h3>JavaScript Interop Test</h3>

<p>This page runs JavaScript when the component finishes rendering.</p>

@code {
    private bool _firstRender = true;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            Console.WriteLine("Component rendered. Running JS interop...");
            await JS.InvokeVoidAsync("showAlert", "JS Interop triggered on render!");
        }
    }
}

Program.cs #

var services = builder.Services;
services.AddRazorComponents().AddInteractiveServerComponents();

Routes.razor #

<Router AppAssembly="typeof(Program).Assembly">
    <Found Context="routeData">
        <RouteView RouteData="routeData" DefaultLayout="@typeof(Layout.MainLayout)" />
        <FocusOnNavigate RouteData="routeData" Selector="h1" />
    </Found>
</Router>

正常工作的内容 #

• 在DevTools中执行showAlert("Hello from console!")可正常弹出提示，说明脚本已正确加载；
• 脚本显示在浏览器Sources面板中；
• 浏览器控制台无报错；
• Blazor Server其他功能运行正常。

无法正常工作的内容 #

• 点击包含@onclick="..."的按钮并调用JS.InvokeVoidAsync(...)无任何反应；
• 在OnAfterRenderAsync中调用JS也无反应，未弹出提示；
• 服务器端也未显示Console.WriteLine()的控制台日志。

恳请各位提供帮助。

内容的提问来源于stack exchange，提问作者ZNAXNOR