Can't fetch any data on AspNet Core Blazor WASM

[avatar29a]

Can't fetch any data on AspNet Core Blazor WASM

[arsinclair]

In case anyone is wondering now how to make it work in blazor, here's how I do it. In Program.cs register scoped MusicBrainzService:

public static async Task Main(string[] args)
{
    var builder = WebAssemblyHostBuilder.CreateDefault(args);
    ...

    builder.Services.AddScoped(x => new MusicBrainzClient(CreateMusicBrainzHttpClient()));

    ...
    await builder.Build().RunAsync();
}

private static HttpClient CreateMusicBrainzHttpClient()
{
    HttpClient client = new HttpClient();
    client.BaseAddress = new Uri("https://musicbrainz.org/ws/2/");
    client.DefaultRequestHeaders.UserAgent.Add(new System.Net.Http.Headers.ProductInfoHeaderValue("Hqub.MusicBrainz", "3.0-beta"));
    client.DefaultRequestHeaders.UserAgent.Add(new System.Net.Http.Headers.ProductInfoHeaderValue("+(https://github.com/avatar29A/MusicBrainz)"));
    return client;
}

and then in your actual .razor file you need to inject it before it can be used:

@inject MusicBrainzClient musicBrainzClient

...

@code {
    private async Task GetRelease(string id)
    {
        release = await musicBrainzClient.Releases.GetAsync(id);

        ...
    }
}

[arsinclair]

I can see two solutions: either allow the user to provide their own HttpClient implementation

public MusicBrainzClient(string baseAddress, IWebProxy proxy, HttpClient httpClient)
{
    var urlBuilder = new UrlBuilder(true);

    Artists = new ArtistService(this, urlBuilder);
    Recordings = new RecordingService(this, urlBuilder);
    Releases = new ReleaseService(this, urlBuilder);
    ReleaseGroups = new ReleaseGroupService(this, urlBuilder);
    Work = new WorkService(this, urlBuilder);

    client = httpClient ?? CreateHttpClient(new Uri(baseAddress), true, proxy);
    client.BaseAddress = new Uri(baseAddress);
}

or don't use HttpClientHandler

private HttpClient CreateHttpClient(Uri baseAddress)
{
    return new HttpClient() {
        DefaultRequestHeaders.Add("User-Agent", UserAgent);
        BaseAddress = baseAddress;
    };
}

By the way, what is the purpose of HttpClientHandler here? Is it just to be able to use proxy?

[wo80]

By the way, what is the purpose of HttpClientHandler here? Is it just to be able to use proxy?

Well, using HttpClient I thought HttpClientHandler was the way to setup some advanced aspects like proxies.

I guess there are two options now:

1. Add a special factory method, something like

public static MusicBrainzClient CreateWasmClient(...);

2. Use HttpWebRequest instead of HttpClient and set up proxy and compression headers there.

I haven't used Blazor yet, so please test whatever solution you prefer. A pull request would be welcome.

[wo80]

Additional note:

At first I discarded your proposal of adding a separate constructor

public MusicBrainzClient(string baseAddress, IWebProxy proxy, HttpClient httpClient)

since I like to keep the number of separate constructors (with multiple arguments) as low as possible, but in this case, only one additional constructor would be necessary:

public MusicBrainzClient(HttpClient httpClient)

Additionally, the proxy setup could be propagated through a public property (forwarded to HttpClient.DefaultProxy).

[arsinclair]

@wo80 Sorry I wasn't able to find time to look into it yet. At a glance, these are all good suggestions. I will take a closer look, hopefully, tomorrow.

[arsinclair]

Add a special factory method, something like public static MusicBrainzClient CreateWasmClient(...);

I feel like the API module doesn't need to know what kind of parent consumes it and provide specific implementations.

Use HttpWebRequest instead of HttpClient and set up proxy and compression headers there

It looks like HttpWebRequest doesn't support async/await OOTB, so not the best option IMO.

only one additional constructor would be necessary

I think you've found a best way to do it. I just tested the code, and it solves the problem. This way the client can provide their own HttpClient, with Proxy or without - is up to them.

Thank you so much.