Trying to set a base address in Blazor WASM from the appSettings.json file and not having much luck

Question

I am learning Blazor WASM, and have used an example app from a book as a starting point. I have an appSettings.Debug.json file under wwwroot folder, and its contents is this:

{
  "BaseUrl": "https://localhost:7163"
}

This is what my Program.cs file looks like:

using System.Net.Http;
using Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using ShoppingCart;

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");

string baseAddress =
    builder.Configuration.GetValue<string>("BaseUrl");

builder.Services.AddHttpClient("ShoppingCart", client => client.BaseAddress =
    new Uri(baseAddress));

builder.Logging.SetMinimumLevel(LogLevel.Debug);

await builder.Build().RunAsync();

And I am attempting to read the BaseUrl string like this :

string baseAddress =
    builder.Configuration.GetValue<string>("BaseUrl");

When I set a breakpoint, and get past this line, baseAddress variable is still set to null.

Later on, in my store.razor component, I read from a JSON file:

@code {
    public IList<Product> products;
    public IList<Product> cart = new List<Product>();
    private int total;

    protected override async Task OnInitializedAsync()
    {
        Logger.LogInformation(".GetFromJsonAsync() method about to be called");
        if (Http.BaseAddress == null)
        {
            Logger.LogWarning("Base address is null");
        }

        try
        {
            const string fullProductPath = "https://localhost:7163/sample-data/products.json";
            string productFilePath = (Http.BaseAddress != null) ? 
                string.Concat(Http.BaseAddress.ToString(), "sample-data/products.json") : fullProductPath;
            products = await Http.GetFromJsonAsync<Product[]>(productFilePath);
            Logger.LogInformation(".GetFromJsonAsync() method was called on a previous line");
        }
        catch (Exception ex)
        {
            Logger.LogError(ex.Message);
        }

       
    }

    private void AddProduct(Product product)
    {
        cart.Add(product);
        total += product.Price;
    }

    private void DeleteProduct(Product product)
    {
        cart.Remove(product);
        total -= product.Price;
    }
}

The only reason why my GetFromJSONAsync() call even works is because I am using a hard-coded uri string in case the base address is not properly set. Now, I've read in a few places that Program.cs might not be the best place to set the base address, so I am wondering if I should just try to read the appSettings.json file from my razor component. Also, I've changed the ASPNETCORE_ENVIRONMENT variable from Development to Debug, so that my appSettings.Debug.json file gets properly read.

  "profiles": {
    "ShoppingCart": {
      "commandName": "Project",
      "dotnetRunMessages": true,
      "launchBrowser": true,
      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
      "applicationUrl": "https://localhost:7163;http://localhost:5163",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Debug"
      }
    },

Where am I going wrong?

Answer 1

I do not know why you have issues fetching information from appsettings.json, we do not use them in our app. Can it be because it is not sent on client side, so the file is not found? /shrug

Here is how we obtain the Base Url for the origin of the server:

Uri uri = new Uri(builder.HostEnvironment.BaseAddress);

Not sure if this can help you, but its worth a try.