Esercitazione: Connettere un'app ASP.NET Core a SQL Server usando .NET Aspire e Entity Framework Core
In questa esercitazione viene creata un'app ASP.NET Core che usa un'integrazione .NET AspireEntity Framework CoreSQL Server per connettersi a SQL Server per leggere e scrivere i dati dei ticket di supporto. Entity Framework Core è un mapper relazionale a oggetti open source leggero ed estendibile che consente agli sviluppatori di .NET di lavorare con i database usando oggetti .NET. Si apprenderà come:
- Creare un'app di base .NET configurata per utilizzare le integrazioni .NET Aspire
- Aggiungere un'integrazione .NET Aspire per connettersi a SQL Server
- Configurare e usare le funzionalità del componente .NET.NET Aspire per leggere e scrivere dal database
Prerequisiti
Per usare .NET.NET Aspire, è necessario che il codice seguente sia installato in locale:
- .NET 8.0 o .NET 9.0
- Runtime del contenitore conforme a OCI, come ad esempio:
- Docker Desktop o Podman. Per altre informazioni, vedere Runtime del contenitore.
- Un ambiente di sviluppo integrato (IDE) o un editor di codice, ad esempio:
- Visual Studio 2022 versione 17.9 o successiva (facoltativo)
-
Visual Studio Code (facoltativo)
- C# Dev Kit: Estensione (facoltativo)
- JetBrains Rider con .NET.NET Aspire plug-in (Facoltativo)
Per altre informazioni, vedere .NET.NET Aspire configurazione e strumentie .NET.NET Aspire SDK.
Creare la soluzione di esempio
- Nella parte superiore di Visual Studiopassare a File>Nuovo progetto>.
- Nella finestra di dialogo cercare Blazor e selezionare Blazor applicazione Web. Scegliere Avanti.
- Nella schermata Configura il tuo nuovo progetto:
- Immettere un nome progetto di AspireSQLEFCore.
- Lasciare i valori predefiniti rimanenti e selezionare Avanti.
- Sulla schermata Informazioni aggiuntive :
- Assicurati che sia selezionato .NET 9.0.
- Verificare che la modalità di rendering interattiva sia impostata su Nessuna.
- Selezionare l'opzione Enlist in .NET.NET Aspire orchestration e selezionare Create.
Visual Studio crea una nuova soluzione di ASP.NET Core strutturata per l'uso di .NET Aspire. La soluzione è costituita dai progetti seguenti:
- AspireSQLEFCore: un progetto di Blazor che si basa sulle impostazioni predefinite del servizio.
- AspireSQLEFCore.AppHost: un progetto di orchestrazione progettato per connettere e configurare i diversi progetti e servizi della tua app. L'orchestratore deve essere impostato come progetto di avvio.
- AspireSQLEFCore.ServiceDefaults: libreria di classi condivisa per contenere configurazioni che possono essere riutilizzate tra i progetti nella soluzione.
Creare il modello di database e le classi di contesto
Per rappresentare una richiesta di supporto inviata dall'utente, aggiungere la seguente classe del modello di SupportTicket
nella radice del progetto AspireSQLEFCore.
using System.ComponentModel.DataAnnotations;
namespace AspireSQLEFCore;
public sealed class SupportTicket
{
public int Id { get; set; }
[Required]
public string Title { get; set; } = string.Empty;
[Required]
public string Description { get; set; } = string.Empty;
}
Aggiungere la seguente classe di contesto dati TicketDbContext
alla radice del progetto AspireSQLEFCore. La classe eredita System.Data.Entity.DbContext per lavorare con Entity Framework e rappresentare il database.
using Microsoft.EntityFrameworkCore;
using System.Reflection.Metadata;
namespace AspireSQLEFCore;
public class TicketContext(DbContextOptions options) : DbContext(options)
{
public DbSet<SupportTicket> Tickets => Set<SupportTicket>();
}
Aggiungere l'integrazione .NET Aspire all'app Blazor
Aggiungi il pacchetto della libreria .NET AspireEntity Framework Core Sql Server al progetto AspireSQLEFCore :
dotnet add package Aspire.Microsoft.EntityFrameworkCore.SqlServer
Il progetto AspireSQLEFCore è ora configurato per utilizzare le integrazioni .NET.NET Aspire. Di seguito è riportato il file di AspireSQLEFCore.csproj aggiornato:
<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>net9.0</TargetFramework>
<Nullable>enable</Nullable>
<ImplicitUsings>enable</ImplicitUsings>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="Aspire.Microsoft.EntityFrameworkCore.SqlServer" Version="9.0.0" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\AspireSQLEFCore.ServiceDefaults\AspireSQLEFCore.ServiceDefaults.csproj" />
</ItemGroup>
</Project>
Configurare l'integrazione .NET.NET Aspire
Nel file Program.cs del progetto AspireSQLEFCore , aggiungere una chiamata al metodo di estensione AddSqlServerDbContext dopo la creazione del builder
ma prima della chiamata a AddServiceDefaults
. Per altre informazioni, vedere impostazioni predefinite del servizio .NET.NET Aspire. Specificare il nome della stringa di connessione come parametro.
using AspireSQLEFCore;
using AspireSQLEFCore.Components;
var builder = WebApplication.CreateBuilder(args);
builder.AddSqlServerDbContext<TicketContext>("sqldata");
builder.AddServiceDefaults();
// Add services to the container.
builder.Services.AddRazorComponents().AddInteractiveServerComponents();
var app = builder.Build();
app.MapDefaultEndpoints();
Questo metodo esegue le attività seguenti:
- Registra un
TicketContext
con il contenitore DI per connettersi al database SQL containerizzato Azure. - Abilitare automaticamente i controlli di integrità, la registrazione e i dati di telemetria corrispondenti.
Creare il database
Durante lo sviluppo in locale, è necessario creare un database all'interno del contenitore SQL Server. Aggiornare il file Program.cs con il codice seguente:
using AspireSQLEFCore;
using AspireSQLEFCore.Components;
var builder = WebApplication.CreateBuilder(args);
builder.AddSqlServerDbContext<TicketContext>("sqldata");
builder.AddServiceDefaults();
// Add services to the container.
builder.Services.AddRazorComponents().AddInteractiveServerComponents();
var app = builder.Build();
app.MapDefaultEndpoints();
if (app.Environment.IsDevelopment())
{
using (var scope = app.Services.CreateScope())
{
var context = scope.ServiceProvider.GetRequiredService<TicketContext>();
context.Database.EnsureCreated();
}
}
else
{
app.UseExceptionHandler("/Error", createScopeForErrors: true);
// The default HSTS value is 30 days.
// You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
Il codice precedente:
- Controlla se l'app è in esecuzione in un ambiente di sviluppo.
- In caso affermativo, recupera il servizio
TicketContext
dal contenitore DI e chiamaDatabase.EnsureCreated()
affinché crei il database se non esiste già.
Nota
Si noti che EnsureCreated()
non è adatto per gli ambienti di produzione e crea solo il database come definito nel contesto. Non applica alcuna migrazione. Per ulteriori informazioni sulle migrazioni di Entity Framework Core in .NET Aspire: vedere Applicare le migrazioni Entity Framework Core in .NET Aspire.
Creare il modulo
L'app richiede un modulo affinché l'utente possa inviare informazioni sul ticket di supporto e salvare la voce nel database.
Usa il seguente markup Razor per creare un formulario di base, sostituendo il contenuto del file Home.razor nella directory AspireSQLEFCore/Components/Pages.
@page "/"
@inject TicketContext context
@using Microsoft.EntityFrameworkCore
<div class="row">
<div class="col-md-6">
<div>
<h1 class="display-4">Request Support</h1>
</div>
<EditForm Model="@Ticket" FormName="Tickets" method="post"
OnValidSubmit="@HandleValidSubmit" class="mb-4">
<DataAnnotationsValidator />
<div class="mb-4">
<label>Issue Title</label>
<InputText class="form-control" @bind-Value="@Ticket.Title" />
<ValidationMessage For="() => Ticket.Title" />
</div>
<div class="mb-4">
<label>Issue Description</label>
<InputText class="form-control" @bind-Value="@Ticket.Description" />
<ValidationMessage For="() => Ticket.Description" />
</div>
<button class="btn btn-primary" type="submit">Submit</button>
<button class="btn btn-danger mx-2" type="reset" @onclick=@ClearForm>Clear</button>
</EditForm>
<table class="table table-striped">
@foreach (var ticket in Tickets)
{
<tr>
<td>@ticket.Id</td>
<td>@ticket.Title</td>
<td>@ticket.Description</td>
</tr>
}
</table>
</div>
</div>
@code {
[SupplyParameterFromForm(FormName = "Tickets")]
private SupportTicket Ticket { get; set; } = new();
private List<SupportTicket> Tickets = [];
private void ClearForm() => Ticket = new();
protected override async Task OnInitializedAsync()
{
Tickets = await context.Tickets.ToListAsync();
}
private async Task HandleValidSubmit()
{
context.Tickets.Add(Ticket);
await context.SaveChangesAsync();
Tickets = await context.Tickets.ToListAsync();
ClearForm();
}
}
Per altre informazioni sulla creazione di moduli in Blazor, vedere panoramica dei moduli ASP.NET CoreBlazor.
Configurare l'AppHost
Il progetto AspireSQLEFCore.AppHost è l'agente di orchestrazione per la tua app. È responsabile della connessione e della configurazione dei diversi progetti e servizi dell'app. L'orchestratore deve essere impostato come progetto di avvio.
Aggiungere il pacchetto NuGet .NET Aspire Hosting Sql Server al progetto AspireStorage.AppHost:
dotnet add package Aspire.Hosting.SqlServer
Sostituire il contenuto del file Program.cs nel progetto AspireSQLEFCore.AppHost con il codice seguente:
var builder = DistributedApplication.CreateBuilder(args);
var sql = builder.AddSqlServer("sql")
.AddDatabase("sqldata");
builder.AddProject<Projects.AspireSQLEFCore>("aspiresql")
.WithReference(sql)
.WaitFor(sql);
builder.Build().Run();
Il codice precedente aggiunge una risorsa contenitore SQL Server all'app e configura una connessione a un database denominato sqldata
. Le classi Entity Framework configurate in precedenza useranno automaticamente questa connessione durante la migrazione e la connessione al database.
Eseguire e testare l'app in locale
L'app di esempio è ora pronta per il test. Verificare che i dati del modulo inviati siano persistenti nel database completando i passaggi seguenti:
Selezionare il pulsante Esegui nella parte superiore di Visual Studio (o F5) per avviare il dashboard del progetto .NET.NET Aspire nel browser.
Nella riga AspireSQLEFCore della pagina dei progetti, fare clic sul collegamento nella colonna Endpoint per aprire l'interfaccia della tua app.
Immettere i dati di esempio nei campi del modulo
Title
eDescription
.Selezionare il pulsante Invia per inviare il ticket di supporto per l'elaborazione; successivamente, selezionare Pulisci per svuotare il modulo.
I dati inviati vengono visualizzati nella tabella nella parte inferiore della pagina quando la pagina viene ricaricata.