https://github.com/sample-by-jsakamoto/blazor-clientsideblazorssr
This sample code describe that how to enable server-side rendering on a client-side blazor application.
https://github.com/sample-by-jsakamoto/blazor-clientsideblazorssr
blazor blazor-client blazor-webassembly serverside-rendering ssr
Last synced: 12 days ago
JSON representation
This sample code describe that how to enable server-side rendering on a client-side blazor application.
- Host: GitHub
- URL: https://github.com/sample-by-jsakamoto/blazor-clientsideblazorssr
- Owner: sample-by-jsakamoto
- License: unlicense
- Created: 2019-11-24T06:39:56.000Z (over 6 years ago)
- Default Branch: net5
- Last Pushed: 2021-04-12T12:32:47.000Z (about 5 years ago)
- Last Synced: 2025-08-08T01:20:59.952Z (11 months ago)
- Topics: blazor, blazor-client, blazor-webassembly, serverside-rendering, ssr
- Language: C#
- Size: 227 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Sample Code: How to enable Server-Side Rendering on Client-Side Blazor App?
## Summary
This sample code describes that how to enable server-side rendering on a client-side blazor application.
## Pre required
- [.NET 5.0 SDK](https://dotnet.microsoft.com/download/dotnet/5.0)
- A Client-Side Blazor application with ASP.NET Core hosted project.
## Migration Step
1. Remove "index.html" from the client project, and add "_Host.cshtml" Razor Page file to the server project, instead.
The contents of "_Host.cshtml" is almost a copy of "index.html", however, it has server-side rendering instruction in the `` element.
```html
...
```
2. Add Razor Pages feature to the server at server-side Startup class, and change the fallback page specification to the URL of "_Host.razor" Razor Page.
```csharp
public class Startup
{
public void ConfigureServices(IServiceCollection services)
{
services.AddRazorPages();
...
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
...
app.UseEndpoints(endpoints =>
{
...
endpoints.MapFallbackToPage("/_Host");
});
...
```
That's all!
## Appendix
However, the `HttpClient` dependency injection at Blazor components might be failed when it's rendering in server-side.
Therefore, those Blazor components such as `Fetch.razor` have to change that implementation.
You can see one of the examples ways at [the commit 18298a37](https://github.com/sample-by-jsakamoto/Blazor-ClientSideBlazorSSR/commit/18298a37fe85c274431fba83d0b2127f7265ff6a).
# License
This sample code provides under [The Unlicense](LICENSE).