CODEWITHSUNDEEP
blazorblazor-client-sideblazor-webassembly
Trevor
Trevor

Reputation: 2206

How does Blazor WebAssembly Server project reference the Client Index?

Using Template: Blazor WebAssembly App with ASP.NET Core hosted enabled

It creates projects:

I can see that server has a project reference to the Client, but I cannot determine what code allows the server to display the client?

How does the server know that the client index file is in another assembly?

Is the client code being hosted in the server project on the same port?

I'm a bit lost trying to figure this out.

Upvotes: 8

Views: 1965

Answers (2)

nf313743
nf313743

Reputation: 4227

To add to Henk's answer:

index.html belongs in the Client project. It is not copied over at compile time. How is index.html accessed at runtime? Is it embedded within one of the DLLs?

This was the question I was asking myself. It looks like when you're developing a file is generated in the bin/ directory of the Server: BlazorApp2.Server.staticwebassets.runtime.json - your file name will differ.

This file the contains the absolute path of the wwwroot on your machine, along with relative paths of all the files within this directory - index.html is one of them.

On dotnet publish the output directory will contain the wwwroot along with its contents.

Upvotes: 1

Henk Holterman
Henk Holterman

Reputation: 273254

The project reference is just there so that MsBuild (VS) can copy the client files to the server's bin directory.

The server then has a special middleware component to serve the client. The following lines are both about serving static files:

app.UseBlazorFrameworkFiles();
app.UseStaticFiles();

The Server does not actually link to or reference any code in the Client.

Is the client code being hosted in the server project on the same port?

Yes, just as a convenience. You could host the client somewhere else (but then also think about CORS settings).

I cannot determine what code allows the server to display the client?

That happens with the last line in UseEndPoints :

endpoints.MapControllers();                  // handle /api
endpoints.MapFallbackToFile("index.html");   // everything else

Do note that because of this your API will never return a 404 code. It will return the "nothing here" page of your client app instead. And you will see a "HTML isn't JSON" related error.

Upvotes: 9

Related Questions