Dall'archivio script > ASP.NET Core

Consumare un endpoint generico in Blazor

di Marco De SanctisMarco De Sanctis, in ASP.NET Core,

Come sappiamo, uno dei grandi vantaggi di Blazor è la possibilità di condividere class library con le API server side. Se per esempio consideriamo il template di default in Visual Studio, la pagina FetchData e il controller WeatherForecastController dialogano scambiandosi istanze di oggetti di tipo WeatherForecast:

public class WeatherForecast
{
    public DateTime Date { get; set; }

    public int TemperatureC { get; set; }

    public string? Summary { get; set; }

    public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
}

Si tratta di un sistema ovviamente molto vantaggioso, perché questa classe rappresenta in pratica il contratto tra client e server, e ci consente di scrivere codice fortemente tipizzato in entrambi i layer applicativi.

Alle volte, tuttavia, potremmo avere la necessità di consumare un endpoint in cui il tipo risultante non sia noto a priori, immaginiamo per esempio un servizio che ci restituisca dati tabellari, i cui nomi dei field possono cambiare di volta in volta. In questo caso possiamo semplicemente effettuare il cast della risposta su un array di Dictionary:

private IDictionary<string, object>[]? results;

protected override async Task OnInitializedAsync()
{
    results = await Http.GetFromJsonAsync<IDictionary<string, object>[]>("GetMyData");
}

A questo punto, possiamo rappresentare questi dati in una tabella che costruiamo dinamicamente in base alle chiavi del dictionary:

@if (results == null)
{
    <p><em>Loading...</em></p>
}
else if (results.Length == 0)
{
    <p><em>No data</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                @foreach (var header in results.First().Keys)
                {
                    <th>@header</th>
                }
            </tr>
        </thead>
        <tbody>
            @foreach (var result in results)
            {
                <tr>
                    @foreach (var fieldName in results.Keys)
                    {
                        <td>@result[fieldName]</td>
                    }
                </tr>
            }
        </tbody>
    </table>
}

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn
Aggiorna

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi