Condividi tramite

Creare un'app Blazor di database di film (parte 5 - Aggiungere la convalida)

  • Articolo

Nota

Questa non è la versione più recente di questo articolo. Per la versione corrente, vedere la versione .NET 9 di questo articolo.

Importante

Queste informazioni si riferiscono a un prodotto non definitive che può essere modificato in modo sostanziale prima che venga rilasciato commercialmente. Microsoft non riconosce alcuna garanzia, espressa o implicita, in merito alle informazioni qui fornite.

Per la versione corrente, vedere la versione .NET 9 di questo articolo.

Questo articolo è la quinta parte dell'esercitazione Blazor sull'app di database di film che illustra le nozioni di base per la creazione di un ASP.NET Core Blazor Web App con funzionalità per gestire un database di film.

Questa parte della serie di esercitazioni illustra come vengono usati i metadati del Movie modello per convalidare l'input dell'utente nei moduli che creano e modificano film.

Convalida tramite annotazioni di dati

Le regole di convalida vengono specificate in una classe modello usando annotazioni di dati. L'elenco seguente mostra alcuni attributi per la System.ComponentModel.DataAnnotations convalida dell'input utente delle proprietà pubbliche nel modello di un modulo:

  • [Required]: richiede che l'utente fornisca un valore.
  • [StringLength]: specifica la lunghezza minima e massima dei caratteri. Si noti che un MinimumLength oggetto passato all'attributo non rende necessaria la stringa (applicare l'attributo[Required]).
  • [RegularExpression]: specificare un criterio di corrispondenza per l'input dell'utente.
  • [Range]: specificare i valori minimo e massimo.

I tipi valore, ad esempio decimal, intfloat, DateOnly, TimeOnly, e DateTime, sono intrinsecamente necessari. L'inserimento di un [Required] attributo sui tipi valore non è necessario.

Le annotazioni di dati aggiuntive che è possibile usare nei moduli sono descritte nella documentazione di Blazor riferimento.

Aggiungere la convalida al Movie modello

Aggiungere le annotazioni di dati seguenti alle proprietà della Movie classe . Per aggiornare tutte le proprietà contemporaneamente, è possibile copiare e incollare l'intero Models/Movie.cs file, visualizzato dopo l'esempio di codice seguente.

+ [Required]
+ [StringLength(60, MinimumLength = 3)]
  public string? Title { get; set; }

+ [Required]
* [StringLength(30)]
+ [RegularExpression(@"^[A-Z]+[a-zA-Z()\s-]*$")]
  public string? Genre { get; set; }

+ [Range(0, 100)]
  [DataType(DataType.Currency)]
  [Column(TypeName = "decimal(18, 2)")]
  public decimal Price { get; set; }

Models/Movie.cs file dopo le annotazioni dei dati precedenti vengono applicate alle proprietà:

using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;

namespace BlazorWebAppMovies.Models;

public class Movie
{
    public int Id { get; set; }

    [Required]
    [StringLength(60, MinimumLength = 3)]
    public string? Title { get; set; }

    public DateOnly ReleaseDate { get; set; }

    [Required]
    [StringLength(30)]
    [RegularExpression(@"^[A-Z]+[a-zA-Z()\s-]*$")]
    public string? Genre { get; set; }

    [Range(0, 100)]
    [DataType(DataType.Currency)]
    [Column(TypeName = "decimal(18, 2)")]
    public decimal Price { get; set; }
}

Le regole di convalida precedenti sono semplicemente per dimostrazione e non sono ottimali per un sistema di produzione. Ad esempio, la convalida precedente impedisce l'immissione di un film con solo uno o due caratteri e non consente altri caratteri speciali per il genere di un film.

Creare una EF Core migrazione e aggiornare il database

Uno schema del modello di dati definisce la modalità di organizzazione e connessione dei dati all'interno di un database relazionale.

L'aggiunta delle annotazioni dei dati alla Movie classe nella sezione precedente non comporta automaticamente modifiche corrispondenti allo schema del database.

Esaminare le annotazioni applicate alla Title proprietà :

[Required]
[StringLength(60, MinimumLength = 3)]
public string? Title { get; set; }

La differenza tra la proprietà del modello e lo schema del database è riepilogata nella tabella seguente. Nessun vincolo corrisponde dopo l'applicazione dell'annotazione dei dati al Movie modello.

Vincolo Proprietà del modello Title Colonna del database Title
Lunghezza massima 60 caratteri Coppie di byte fino a ~2 GB†
NVARCHAR (MAX)
Richiesto
[Required]
NULL è consentito nella colonna .

† Colonne di caratteri di database sono definite dalle dimensioni (coppie di byte). Per i caratteri definiti nell'intervallo Unicode da 0 a 65.535 viene usata una coppia di byte per carattere. Tuttavia, singoli caratteri all'esterno di tale intervallo Unicode accettano più coppie di byte da archiviare, quindi il numero effettivo di caratteri che una colonna può archiviare è arbitrario. Il concetto importante a scopo di confronto tra la Title proprietà del Movie modello e lo schema del database per la Title colonna è che circa 2 GB di coppie di byte archiviate nel database superano di gran lunga il limite di 60 caratteri impostato per la proprietà . Lo schema del database deve essere regolato verso il basso in modo che corrisponda al vincolo dell'app.

Per corrispondere alla Movie lunghezza della proprietà del Title modello nell'app, il database deve indicare NVARCHAR (60) le dimensioni della Title colonna. La differenza dello schema non causa EF Core un'eccezione quando l'app viene usata perché un utente che pubblica un titolo di film da 60 caratteri rientra nel limite di ~2 GB di coppia di byte del database per un titolo di film. Si consideri tuttavia la situazione inversa in cui a una proprietà del modello viene assegnato un vincolo maggiore di quello consentito dal database e l'utente pubblica una stringa troppo lunga per una colonna di caratteri del database: un'eccezione viene generata dal database o dai dati viene troncata quando l'utente pubblica il valore. È consigliabile mantenere sempre allineati i modelli dell'app allo schema del database perché uno schema non allineato può causare eccezioni e l'archiviazione di dati non corretti.

Anche se la Title proprietà è un tipo di riferimento nullable (NRT), come indicato da ? nel string tipo (string?), il database non deve archiviare un NULL valore nella colonna Title a causa del vincolo del Required modello. Quando lo schema del database viene aggiornato nel passaggio successivo, la colonna del Title database deve riflettere NOT NULL affinché la Title colonna corrisponda alla proprietà . Il concetto importante è che solo perché una proprietà del modello è un NRT e può contenere un null valore nel codice non significa che lo schema della colonna di database deve essere nullable (NULL consentito). Si tratta di condizioni indipendenti usate per scopi diversi: i valori NRT vengono usati per evitare errori di codifica con tipi nullable, mentre lo schema del database riflette il tipo esatto e le dimensioni dei dati archiviati.

Per allineare il modello e lo schema del database, creare e applicare una EF Coremigrazione del database con un nome di migrazione che identifica le modifiche alla migrazione. Il nome della migrazione è simile a un messaggio di commit in un sistema di controllo della versione. Negli esempi di comando seguenti il nome della migrazione "NewMovieDataAnnotations" riflette che vengono aggiunte nuove annotazioni di dati al Movie modello.

Importante

Assicurarsi che l'app non sia in esecuzione per i passaggi successivi.

L'arresto dell'app quando si usa Visual Studio richiede solo di chiudere la finestra del browser.

Quando si usa VS Code, chiudere la finestra del browser e arrestare l'app in VS Code con Esegui arresta>debug o premendo +F5 sulla tastiera.

Quando si utilizza la CLI di .NET, chiudere la finestra del browser e arrestare l'app nella shell dei comandi con Ctrl+C.

In Visual Studio Esplora soluzioni fare doppio clic su Servizi connessi. Nell'area Dipendenze servizio selezionare i puntini di sospensione (...) seguiti da Aggiungi migrazione nell'area SQL Server Express LocalDB .

Assegnare alla migrazione un nome di migrazione di NewMovieDataAnnotations per descrivere la migrazione. Attendere il caricamento del contesto del database nel campo Nomi classi DbContext. Selezionare Fine per creare la migrazione. Selezionare il pulsante Chiudi al termine dell'operazione.

Selezionare di nuovo i puntini di sospensione (...) seguiti dal comando Aggiorna database .

Verrà visualizzata la finestra di dialogo Aggiorna database con la migrazione più recente. Attendere che il campo Dei nomi delle classi DbContext venga aggiornato e per il caricamento delle migrazioni precedenti. Selezionare il pulsante Fine. Selezionare il pulsante Chiudi al termine dell'operazione.

Usare il comando seguente nel terminale (menu >Nuovo terminale) per aggiungere una migrazione per le nuove annotazioni dati:

dotnet ef migrations add NewMovieDataAnnotations

Per applicare la migrazione al database, eseguire il comando seguente:

dotnet ef database update

Per aggiungere una migrazione per le nuove annotazioni di dati, eseguire il comando seguente in una shell dei comandi aperta nella cartella radice del progetto:

dotnet ef migrations add NewMovieDataAnnotations

Per applicare la migrazione al database, eseguire il comando seguente:

dotnet ef database update

Dopo aver applicato la migrazione, la proprietà del modello e la corrispondenza dello schema del database, come riepilogato nella tabella seguente.

Vincolo Proprietà del modello Title Colonna del database Title
Lunghezza massima 60 caratteri Sono consentite sessanta (60) coppie di byte†.
NVARCHAR (60)
Richiesto
[Required]
NOT NULL è indicato per la colonna.

†Sixty (60) coppie di byte è di 60 caratteri se viene usata una coppia di byte per carattere per archiviare il titolo del film, che è true quando si usano caratteri definiti nell'intervallo Unicode da 0 a 65.535.

Risolvere i problemi relativi all'esempio completato

Se si verifica un problema durante l'esercitazione che non è possibile risolvere dal testo, confrontare il codice con il progetto completato nel Blazor repository degli esempi:

Blazor repository GitHub di esempi (dotnet/blazor-samples)

Selezionare la cartella versione più recente. La cartella di esempio per il progetto di questa esercitazione è denominata BlazorWebAppMovies.

Risorse aggiuntive

Passaggi successivi

Precedente: Usare un databaseAvanti: Aggiungere la ricerca