Blazor httpclient endpoint address configs

Question

I'm playing around with Blazor in .net core 3 preview 5.

My solution is quite simple, with one project for the web api and a second for the blazor client app.

The api is currently serving on localhost:5000 and the blazor app on localhost:5001, and I'm using httpclient to make http calls to the rest endpoint.

One thing in struggling with is understanding the best way to avoid baking in the api server URLs into the blazor app.

Is there am established pattern which will enable be to specify the base url by config or run time?

Edit to add info from comment:

Ultimately, I'd like to run it in a container in our test k8s cluster, that means the target url for the api would change to (say) api.test.companydns.com. the blazor app will end up running inside a container, so ideally I could pass in the api url as a parameter. I wasnt sure of the best way to do that as the blazor code ends up being executed on the client side

Answer 1

Question: Is there am established pattern which will enable be to specify the base url by config or run time?

Answer: Yes, the base Uri of your Blazor client side is determined by the <base> HTML element set in /wwwroot/index.html like so:

<base href="/" />

Hope this helps...

Answer 2

I've done a bit of a hack which works for me (posted more to show I'm putting effort into solving the problem for myself!!):

I've added a config file to wwwroot\config\config.json which contains:

{
  "apiBaseUrl": "api.url.com"
}

Next, I've created an AppState.cs which used the HttpClient to download and store the base URL (Defaul DI instance of HttpClient has a BaseURL of the url serving the Blazor client app).

The AppState class is then made available using DI, so now all my Services can make calls to the new endpoint.

Lastly, I can use a build pipeline / CI / Docker volume / K8s config map to supply the relivent config.json depending on the hosting environment and without further changes to any Blazor app code.