Identifying whether the page is server or client for RenderMode.Auto

[gragra33]

Is there an existing issue for this?

• I have searched the existing issues

Is your feature request related to a problem? Please describe the problem.

Whilst writing components to support all render modes is preferred, there may be cases where it is not always possible.

Describe the solution you'd like

For these cases, having a property or method with the running state for the component on the ComponentBase class would make this possible.

Additional context

A current workaround is to check the IJSRuntime interface for if it inherits IJSInProcessRuntime. Here is my current workaround: Blazor.WhereAmIRunning. The sample project visually demonstrates how it works.

[javiercn]

@gragra33 thanks for contacting us.

You can use OperatingSystem.IsBrowser() to this effect.

[gragra33]

@javiercn well, shoot ... yep, that works well. When was that added?

[javiercn]

@gragra33 It's been there for a while.

We do plan to make this a more obvious concept in the API, but we haven't made it a priority since there are easy ways to figure this out.

[guardrex]

It's covered in our JSImport/Export JS interop article ...

https://learn.microsoft.com/aspnet/core/blazor/javascript-interoperability/import-export-interop

... but it should also appear in our JS interop overview. I'll add it there to improve its visibility.

Looks like it came in at 6.0 on #26140.

[marinasundstrom]

This is how I solved it:

I have an abstract RenderingContext class with two deriving implementations:

For Server: https://github.com/marinasundstrom/Blazor8Test/blob/main/src/Server/ServerRenderingContext.cs
For Client: https://github.com/marinasundstrom/Blazor8Test/blob/main/src/Client/ClientRenderingContext.cs

These are, of course, registered depending on context.

You can inject RenderingContext into your component, and it will resolve to the correct implementation depending on context. When the component is running on the server, the Server-specific implementation has a property that return a value indicating whether it is pre-rendering.

You can then just check the IsPrerendering property in your component.

[javiercn]

Dupe of #49401