我可以设置全局渲染模式“InteractiveServer”并覆盖它以在 Blazor Web 应用程序中的每个组件中使用“StaticServer”吗？

Question

我正在将 Blazor 服务器应用程序 (.Net 7) 迁移到新的 Blazor Web 应用程序 (.Net 8)。

该项目还包括一些 Razor 页面 (cshtml)，我现在想将其迁移到新的静态服务器渲染 (SSR)。

是否可以在路由组件中声明全局渲染模式“InteractiveServer”：

<Routes @rendermode="InteractiveServer" />

并覆盖某些组件以使用渲染模式“StaticServer”？该选项似乎在枚举中不可用。

另一个选项是不设置全局渲染模式“InteractiveServer”，而是为每个组件声明它。我目前正在尝试让它工作，但它破坏了很多现有的功能，所以我更喜欢相反的方式。

简而言之，如何设置全局渲染模式“InteractiveServer”并覆盖它以对几个页面/组件使用“StaticServer”？

Answer 1

有两种方法可以实现这一目标。

案例1。如果应使用 StaticServer 的所有页面的路由以相同的路由段开头（即位于同一文件夹中），则使用。

例如，如果“帐户”文件夹中的所有页面均应使用 StaticServer 渲染模式

在App.razor中添加以下内容

@code {
[CascadingParameter]
private HttpContext HttpContext { get; set; } = default!;

private IComponentRenderMode? RenderModeForPage =>
    HttpContext.Request.Path.StartsWithSegments("/Account")
        ? null
        : InteractiveServer;
}

并设置

<Routes @rendermode="RenderModeForPage" />

“null”渲染模式意味着它将使用 StaticServer 渲染模式。

参考

案例2。当需要使用 StaticServer 渲染的页面分散时使用。

使用以下内容创建一个 StaticSsrLayout.razor

@inherits LayoutComponentBase
@layout MainLayout
@inject NavigationManager NavigationManager

@if (HttpContext is null)
{
    <p>Loading...</p>
}
else
{
    @Body
}

@code {
    [CascadingParameter]
    private HttpContext? HttpContext { get; set; }

    protected override void OnParametersSet()
    {
        if (HttpContext is null)
        {
            NavigationManager.Refresh(forceReload: true);
        }
    }
}

为所有应使用 StaticServer 渲染的页面设置此布局

@layout StaticSsrLayout

在App.razor中添加以下内容

@code {
[CascadingParameter]
private HttpContext HttpContext { get; set; } = default!;

private IComponentRenderMode? RenderModeForPage =>
    HttpContext.GetEndpoint()?.Metadata.GetMetadata<RenderModeAttribute>()?
        .Mode;
}

并设置

<Routes @rendermode="RenderModeForPage" />

参考

Answer 2

关于雷内在回答中所写的内容。 如果你想要案例 1 的多个路径，你可以这样做：

     private IComponentRenderMode? GetRenderMode(PathString pathString){
        IComponentRenderMode? StaticServer = null;
        bool isAccountPath = pathString.StartsWithSegments("/account");
        bool isSettingsPath = pathString.StartsWithSegments("/settings");
        if(isAccountPath) return StaticServer;
        if(isSettingsPath) return StaticServer;
        return InteractiveServer;
     }
    
    private IComponentRenderMode? RenderModeForPage => GetRenderMode(HttpContext.Request.Path);