Un sistema informatico solido deve avere come requisito uno strumento che permetta di registrare le operazioni dell'utente e del sistema in generale. Più le informazioni sono accurate e analizzabili e meglio il sistema potrà essere corretto in caso di errore o di deriva. Dopo una segnalazione di errore da parte del cliente o degli utenti, i dati presenti a sistema e il log, sono infatti le prime risorse cha abbiamo per diagnosticare il problema. Si tratta di informazioni preziose, tramite le quali possiamo ricostruire la casistica sui nostri sistemi e investigarne le cause.
Per far questo, è necessario verificare tutte le operazioni che l'utente ha eseguito prima dell'anomalia riscontrata. In ambito web, il problema più evidente è tracciare le informazioni lato client, ossia tutto ciò che l'utente esegue sul proprio browser. In passato abbiamo accennato a come ASP.NET Core fornisca un supporto out-of-the-box al log server side, ma ciò che accade sul browser oggi ha una complessità tale da richiedere un log specifico. In questo articolo ci occuperemo per l'appunto di questa esigenza, e mostreremo come soddisfarla grazie a JSNLog.
Introduzione a JSNLog
JSNLog è una libreria open source che può essere scaricata dalla pagina ufficiale o installata tramite NuGet. Essa ci consente di tracciare informazioni di log all'interno del codice JavaScript della pagina. Questi dati verranno successivamente inviati al server come richiesta AJAX, la quale verrà intercettata da un middleware OWIN specifico che si preoccupererà di memorizzare questi eventi in uno storage permanente. La figura in basso illustra il funzionamento di questi componenti.
Per la scrittura dei dati, il middleware di JSNLog si appoggia a un framework di logging server side, e fornisce il supporto alle più utilizzate librerie tra le quali: Elmah, Log4Net, NLog, Serilog e Common.Logging. Lo strumento può essere utilizzato su progetti web con infrastruttura ASP.NET e in particolare: WebForm, MVC, WebApi, e ASP.NET Core. Supportate anche le chiamate CORS.
Impostazione del progetto
Prima entrare nel dettaglio, descriviamo gli step per avere una applicazione ASP .NET Core MVC pronta per loggare client-side. Creiamo un progetto da Visual Studio 2017 di tipo ASP .NET Core e installiamo, tramite NuGet, il pacchetto richiesto per il progetto: JSNLog.AspNetCore.
Per abilitare gli script da utilizzare nelle pagine Razor dovremmo aggiungere i file JavaScript che reperiamo tramite Bower. Il pacchetto da installare si chiama jsnlog.
Questo pacchetto installa un file TypeScript, insieme al corrispondente JavaScript, all'interno della cartella mostrata nella figura in basso.
Per poterlo poi utilizzare, il passo successivo è quello di referenziarlo nella sezione head della view _Layout.cshtml:
<script src="~/lib/jsnlog.js/jsnlog.min.js"></script>
Attenzione: Questo articolo contiene un allegato.
Contenuti dell'articolo
Commenti
Log client side su ASP.NET Core con JSNLog 2
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Visual Studio Code per lo sviluppo in team
Certificati gratuiti e con rinnovo automatico con Azure App Service
Effettuare il testing su mobile di un'applicazione ASP.NET Core durante lo sviluppo
Eliminare il visibility converter nella Universal Windows Platform
Compilare dinamicamente le view in ASP.NET Core 3.0
Invocare trigger non HTTP delle Azure Function durante lo sviluppo
Restituire gli enum come stringhe in ASP.NET Core Web API
Impostare il focus su un controllo in Blazor tramite JavaScript
Usare gli slot di deployment con le Azure Function
Sfruttare HTTP2 con IIS e Kestrel in ASP.NET Core
Recuperare le informazioni sul consumo di memoria nella Universal Windows Platform
Gestire interfacce multiple nella DI di ASP.NET Core
Top Ten Articoli
- Creare API GraphQL con ASP.NET Core e HotChocolate
di Moreno Gentili - Blazor: un viaggio nello state management
di Giampaolo Tucci - Anteprima di ASP.NET Core 3
di Moreno Gentili - Web UI interattive con Blazor Server
di Moreno Gentili - Personalizzare ASP.NET Core Identity
di Moreno Gentili - Inviare web push notification da ASP.NET Core
di Morgan Pizzini - Anteprima di ASP.NET Core 2.1 - Parte 1
di Moreno Gentili - Visual Studio 2017 e il supporto a Docker per ASP.NET Core
di Marco De Sanctis - Anteprima di ASP.NET Core 2.1 - Parte 2
di Moreno Gentili - Sicurezza nelle applicazioni ASP.NET Core
di Daniele Bochicchio, Cristian Civera, Moreno Gentili, Stefano Mostarda, Matteo Tumiati
Articoli via e-mail
Iscriviti alla nostra newsletter nuoviarticoli per ricevere via e-mail le notifiche!
In primo piano
I più letti di oggi
- Comunicazione realtime tra ASP.NET Core e Javascript con GraphQL
- Eliminare i resource group vuoti di Azure via PowerShell
- Chiamare direttamente un numero di telefono con HTML5
- Eseguire integration test di un progetto ASP.NET Core
- Autenticazione con JWT Token e ASP.NET Core Web API
- ecco tutte le novità pubblicate sui nostri siti questa settimana: http://aspit.co/wkly buon week-end!
- Global Azure Milan 2020 - Milano
In evidenza
- Global Azure Milan 2020 - Milano
- Eliminare i resource group vuoti di Azure via PowerShell
- Eseguire integration test di un progetto ASP.NET Core
- Creare layout consistenti grazie al Visual Material in Xamarin Forms
- Visual Studio Code per lo sviluppo in team
- Utilizzare app-shell per rendere un'applicazione Angular più responsiva alla partenza
- Proteggere le risorse Azure da cancellazioni involontarie
- Comunicazione realtime tra ASP.NET Core e Javascript con GraphQL