咨询：.NET 8 Blazor SSR页面调用JavaScript函数的解决方案

Blazor SSR（服务器端渲染）模式下，组件仅在服务器端完成静态渲染后发送至客户端，不存在活跃的SignalR连接和JSRuntime上下文，因此无法直接通过JSRuntime.InvokeAsync调用JS函数。针对你的场景，可以通过以下两种方式实现主题切换：

1. 内联脚本在客户端加载后执行 #

在SSR组件（如Account下的登录/注册页面）底部添加内联<script>标签，利用DOMContentLoaded事件确保页面加载完成后调用ChangeStyleSheet：

<!-- SSR组件内容 -->

<script>
    // 等待DOM完全加载后执行主题切换
    document.addEventListener('DOMContentLoaded', () => {
        ChangeStyleSheet('light'); // 替换为实际主题值
    });
</script>

2. 结合服务器端数据动态传递主题值 #

如果需要根据服务器端获取的用户偏好（如从Cookie、数据库读取）动态设置主题，可以将主题值作为组件参数，渲染到脚本中：

@code {
    // 从服务器端获取用户主题偏好（示例：从HttpContext读取Cookie）
    [Inject] private IHttpContextAccessor HttpContextAccessor { get; set; }
    private string UserTheme { get; set; } = "light";

    protected override void OnInitialized()
    {
        UserTheme = HttpContextAccessor.HttpContext.Request.Cookies["UserTheme"] ?? "light";
    }
}

<!-- 组件其他内容 -->

<script>
    document.addEventListener('DOMContentLoaded', () => {
        ChangeStyleSheet('@UserTheme'); // 服务器渲染时替换为实际值
    });
</script>

注意事项 #

• 确保ChangeStyleSheet函数已在全局作用域可用：该函数需定义在wwwroot下的JS文件中，并在页面加载时提前引用（可在_Host.cshtml或App.razor中通过<script src="..."></script>引入）。
• 避免在SSR组件中使用JSRuntime相关API：此类API仅适用于交互式渲染模式（服务器/WebAssembly）。

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