# L'aggiunta di un cliente C# per Umami API ## Introduzione In questo post, vi mostrerò come creare un cliente C# per l'API di reporting UmamiM SK2 Questo è un semplice esempio che dimostra come autenticare con l' API e ricavare dati da esso. Potete trovare tutto il codice sorgente per questo. [sul mio GitHub repo](https://github.com/scottgal/mostlylucidweb/tree/main/Mostlylucid/Umami). [TOC] ## Prerequisite Installare Umami. Potete trovare le istruzioni per l'installazione. [Qui.](https://www.mostlylucid.net/blog/usingumamiforlocalanalytics) Questo spiega come installo e uso Umami per fornire analisi su questo sito. Di nuovo, questa è una semplice implementazione di alcuni degli endpoint API di Umami Website Stats. Potete trovare la complete documentation dell'API. [Qui.](https://umami.is/docs/api/website-stats). In questo caso ho scelto di implementare i punti finali suivants: - `GET /api/websites/:websiteId/pageviews` - Come suggerisce il nomeM SK1 questo punto finale restituisce le visualizzazioni di pagine e 'sessioni' per un dato sito web in un periodo di tempoMSC4 ```json { "pageviews": [ { "x": "2020-04-20 01:00:00", "y": 3 }, { "x": "2020-04-20 02:00:00", "y": 7 } ], "sessions": [ { "x": "2020-04-20 01:00:00", "y": 2 }, { "x": "2020-04-20 02:00:00", "y": 4 } ] } ``` - `GET /api/websites/:websiteId/stats` - questo riporta le statistiche di base per un dato sito webM SK1 ```json { "pageviews": { "value": 5, "change": 5 }, "visitors": { "value": 1, "change": 1 }, "visits": { "value": 3, "change": 2 }, "bounces": { "value": 0, "change": 0 }, "totaltime": { "value": 4, "change": 4 } } ``` - `GET /api/websites/:websiteId/metrics` - questo restituisce le misurazioni per un dato URL del sito web, ecc. ```json [ { "x": "/", "y": 46 }, { "x": "/docs", "y": 17 }, { "x": "/download", "y": 14 } ] ``` Come potete vedere dai docs, questi tutti accettano un numero di parametri (e li ho rappresentati come parametri di ricerca nel codice sottoM SK2 ## Test in Rider httpClient Comincio sempre a testare l'API in Rider's built-in HTTP clientM SK2 Questo mi permette di testare velocemente l' API e vedere la risposta . ```http ### Login Request and Store Token POST https://{{umamiurl}}/api/auth/login Content-Type: application/json { "username": "{{username}}", "password": "{{password}}" } > {% client.global.set("auth_token", response.body.token); client.global.set("endAt", Math.round(new Date().getTime()).toString() ); client.global.set("startAt", Math.round(new Date().getTime() - 7 * 24 * 60 * 60 * 1000).toString()); %} ### Use Token in Subsequent Request GET https://{{umamiurl}}/api/websites/{{websiteid}}/stats?endAt={{endAt}}&startAt={{startAt}} Authorization: Bearer {{auth_token}} ### Use Token in Subsequent Request GET https://{{umamiurl}}/api/websites/{{websiteid}}/pageviews?endAt={{endAt}}&startAt={{startAt}}&unit=day Authorization: Bearer {{auth_token}} ### GET https://{{umamiurl}}}}/api/websites/{{websiteid}}/metrics?endAt={{endAt}}&startAt={{startAt}}&type=url Authorization: Bearer {{auth_token}} ``` È una buona pratica tenere qui i nomi variabili. `{{}}` un file env.json a cui si può riferire come sotto. ```json { "local": { "umamiurl":"umamilocal.mostlylucid.net", "username": "admin", "password": "", "websiteid" : "32c2aa31-b1ac-44c0-b8f3-ff1f50403bee" } } ``` ## Setup Prima dobbiamo configurere HttpClient e i servizi che utilizzeremo per fare le richieste. ```csharp public static class UmamiSetup { public static void SetupUmamiServices(this IServiceCollection services, IConfiguration config) { var umamiSettings = services.ConfigurePOCO(config.GetSection(UmamiSettings.Section)); services.AddHttpClient(options => { options.BaseAddress = new Uri(umamiSettings.BaseUrl); }) .SetHandlerLifetime(TimeSpan.FromMinutes(5)) //Set lifetime to five minutes .AddPolicyHandler(GetRetryPolicy());; services.AddScoped(); services.AddScoped(); } static IAsyncPolicy GetRetryPolicy() { return HttpPolicyExtensions .HandleTransientHttpError() .OrResult(msg => msg.StatusCode == HttpStatusCode.ServiceUnavailable) .WaitAndRetryAsync(6, retryAttempt => TimeSpan.FromSeconds(Math.Pow(2, retryAttempt))); } } ``` Qui configuriamo la classe di configurazione. `UmamiSettings` e aggiungiamo il `AuthService` e `UmamiService` alla raccolta dei servizi. Aggiungiamo anche una politica di riprova al cliente Http per gestire gli errori transitori. Poi abbiamo bisogno di creare il `UmamiService` e `AuthService` Classi. L'informazione figura nella parte dispositiva. `AuthService` è semplicemente responsabile di ottenere il token JWT dall'API. ```csharp public class AuthService(HttpClient httpClient, UmamiSettings umamiSettings, ILogger logger) { private string _token; public HttpClient HttpClient => httpClient; public async Task LoginAsync() { var loginData = new { username = umamiSettings.Username, password = umamiSettings.Password }; var content = new StringContent(JsonSerializer.Serialize(loginData), Encoding.UTF8, "application/json"); var response = await httpClient.PostAsync("/api/auth/login", content); if (response.IsSuccessStatusCode) { var authResponse = await response.Content.ReadFromJsonAsync(); _token = authResponse.Token; httpClient.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", _token); logger.LogInformation("Login successful"); return true; } logger.LogError("Login failed"); return false; } } ``` Qui abbiamo un metodo semplice. `LoginAsync` che manda una richiesta POST alla `/api/auth/login` il punto finale con il nome di usuario e password. Se la richiesta è riuscita, stormiamo il token JWT nel `_token` e mettiamo il campo. `Authorization` il titolo di HttpClient. L'informazione figura nella parte dispositiva. `UmamiService` è responsabile di fare le richieste all'API. Per ciascuno dei metodi principali I'ho definito degli oggetti di richiesta che accettano tutti i parametri per ogni punto di fine. Tutte segueno un modello simiiar, quindi ve ne mostrerò solo una qui. ```csharp public async Task> GetStatsAsync(StatsRequest statsRequest) { // Start building the query string var queryParams = new List { $"start={statsRequest.StartAt}", $"end={statsRequest.EndAt}" }; // Add optional parameters if they are not null if (!string.IsNullOrEmpty(statsRequest.Url)) queryParams.Add($"url={statsRequest.Url}"); if (!string.IsNullOrEmpty(statsRequest.Referrer)) queryParams.Add($"referrer={statsRequest.Referrer}"); if (!string.IsNullOrEmpty(statsRequest.Title)) queryParams.Add($"title={statsRequest.Title}"); if (!string.IsNullOrEmpty(statsRequest.Query)) queryParams.Add($"query={statsRequest.Query}"); if (!string.IsNullOrEmpty(statsRequest.Event)) queryParams.Add($"event={statsRequest.Event}"); if (!string.IsNullOrEmpty(statsRequest.Host)) queryParams.Add($"host={statsRequest.Host}"); if (!string.IsNullOrEmpty(statsRequest.Os)) queryParams.Add($"os={statsRequest.Os}"); if (!string.IsNullOrEmpty(statsRequest.Browser)) queryParams.Add($"browser={statsRequest.Browser}"); if (!string.IsNullOrEmpty(statsRequest.Device)) queryParams.Add($"device={statsRequest.Device}"); if (!string.IsNullOrEmpty(statsRequest.Country)) queryParams.Add($"country={statsRequest.Country}"); if (!string.IsNullOrEmpty(statsRequest.Region)) queryParams.Add($"region={statsRequest.Region}"); if (!string.IsNullOrEmpty(statsRequest.City)) queryParams.Add($"city={statsRequest.City}"); // Combine the query parameters into a query string var queryString = string.Join("&", queryParams); // Make the HTTP request var response = await authService.HttpClient.GetAsync($"/api/websites/{WebsiteId}/stats?{queryString}"); if (response.IsSuccessStatusCode) { var content = await response.Content.ReadFromJsonAsync(); return new UmamiResult(response.StatusCode, response.ReasonPhrase ?? "Success", content ?? new StatsResponseModels()); } if (response.StatusCode == HttpStatusCode.Unauthorized) { await authService.LoginAsync(); return await GetStatsAsync(statsRequest); } logger.LogError("Failed to get stats"); return new UmamiResult(response.StatusCode, response.ReasonPhrase ?? "Failed to get stats", null); } ``` Qui potete vedere che io prendo l'oggetto della richiesta. ```csharp public class BaseRequest { public long StartAt => StartAtDate.ToMilliseconds(); // Timestamp (in ms) of starting date public long EndAt => EndAtDate.ToMilliseconds(); // Timestamp (in ms) of end date public DateTime StartAtDate { get; set; } public DateTime EndAtDate { get; set; } } public class StatsRequest : BaseRequest { // Optional properties public string? Url { get; set; } // Name of URL public string? Referrer { get; set; } // Name of referrer public string? Title { get; set; } // Name of page title public string? Query { get; set; } // Name of query public string? Event { get; set; } // Name of event public string? Host { get; set; } // Name of hostname public string? Os { get; set; } // Name of operating system public string? Browser { get; set; } // Name of browser public string? Device { get; set; } // Name of device (e.g., Mobile) public string? Country { get; set; } // Name of country public string? Region { get; set; } // Name of region/state/province public string? City { get; set; } // Name of city } ``` E costruiamo la sequenza di query dai parametri. Se la richiesta è riuscita, ritroviamo il contenuto come un `UmamiResult` l'oggetto. Se la richiesta non funziona con un codice di stato 401 , chiamiamo il `LoginAsync` method and retry the request. This ensures we 'elegantlyM SK2 handle the token expiry . ## Conclusione Questo è un semplice esempio di come creare un cliente C# per l'API UmamiM SK1 Potete usarlo come punto di partenza per costruire clienti più complessi o integrare l' API nelle vostre stesse applicazioni.