asp.net-coreblazorblazor-server-side

How can I programmatically determine the Blazor render mode


How can I get the render mode Blazor is using for my component. There is this suggestion but that won't work for Auto as it could be either. I want to verify I've configured everything properly so my app is tunning in InteractiveServer.


Solution

  • You could try following in a Blazor WebApp template Auto-global project:
    Install Microsoft.AspNetCore.Http 2.2.2 in client project. Then you could visit HttpContext by CascadingParameter or IHttpContext Accessor. They have some difference.

    1.Cascading Parameter
    Modify Home.razor like below

    @page "/"
    @using System.Runtime.InteropServices
    @using Microsoft.AspNetCore.Http
    @rendermode InteractiveAuto
    
    @render_mode
    
    @code {
        private string? render_mode;
        [CascadingParameter]
        public HttpContext? HttpContext { get; set; }
    
        protected override void OnInitialized()
        {
            if (HttpContext != null)
            {
                    render_mode = "prerender";
            }
    
            else
            {
                if (RuntimeInformation.ProcessArchitecture != Architecture.Wasm)
                {
                    render_mode = "server";  //the architecture could be x64 depending on your machine.
                }
    
                if (RuntimeInformation.ProcessArchitecture == Architecture.Wasm)
                {
                    render_mode = "wasm";
                }
            }
        }
    }
    

    Then clear the browser cache, when run the project you will see the "render_mode" change from "prerender" to "Server" .Then after a while when wasm finished downloaded and refresh the page again, you will see it change from "prerender" to "wasm". As this is document said to access httpcontext using cascading way. https://learn.microsoft.com/en-us/aspnet/core/fundamentals/http-context?view=aspnetcore-8.0#ihttpcontextaccessorhttpcontext-in-razor-components-blazor

    The value is always null for interactive rendering.

    So we use "HttpContext != null" to determine if it is prerender.

    2.IHttpContextAccessor
    As the document said, this is not recommanded in blazor. But I think it should be clearify that if using IhttpcontextAccessor.HttpContext, both "prerender" or "InteractiveServicer" won 't have null Httpcontext. You will need to distinguish them by using HttpContext.Response.HasStarted . Don't forget to add builder.Services.AddHttpContextAccessor(); to both server and client project then modify the Home.razor like below.

    @page "/"
    @using System.Runtime.InteropServices
    @using Microsoft.AspNetCore.Http
    @rendermode InteractiveAuto
    @inject IHttpContextAccessor _httpContextAccessor
    
    @render_mode
    
    @code {
        private string? render_mode;
    
    
        protected override void OnInitialized()
        {
            if (_httpContextAccessor.HttpContext != null)
            {
                if (!_httpContextAccessor.HttpContext.Response.HasStarted)
                {
                    render_mode = "prerender";
                }
                else
                {
                    render_mode = "server";
    
                }
            }
    
            else
            {
                    render_mode = "wasm";
            }
        }
    }
    

    Then the above 2 ways will have the same test result.