Esercitazione: Distribuire un'app ASP.NET in Azure con database SQL di Azure

Servizio app di Azure offre un servizio di hosting Web con scalabilità elevata e funzioni di auto-correzione. Questa esercitazione illustra come distribuire un'app ASP.NET basata sui dati nel servizio app e connetterla al database SQL di Azure. Al termine sarà disponibile un'app ASP.NET in esecuzione in Azure e connessa al database SQL.

Published ASP.NET application in Azure App Service

In questa esercitazione apprenderai a:

  • Creare un database nel database SQL di Azure
  • Connettere un'app ASP.NET al database SQL
  • Distribuire l'app in Azure
  • Aggiornare il modello di dati e ridistribuire l'app
  • Eseguire lo streaming dei log da Azure al terminale

Se non si ha una sottoscrizione di Azure, creare un account Azure gratuito prima di iniziare.

Prerequisiti

Per completare questa esercitazione:

Installare Visual Studio 2022 con i carichi di lavoro ASP.NET e sviluppo Web e sviluppo di Azure.

Se Visual Studio è già stato installato, aggiungere i carichi di lavoro in Visual Studio facendo clic su Strumenti>Ottieni strumenti e funzionalità.

Scaricare l'esempio

  1. Scaricare il progetto di esempio.

  2. Estrarre (decomprimere) il file dotnet-sqldb-tutorial-master.zip.

Il progetto di esempio contiene un'app CRUD (create-read-update-delete) ASP.NET MVC di base che usa Code First di Entity Framework.

Eseguire l'app

  1. Aprire il file dotnet-sqldb-tutorial-master/DotNetAppSqlDb.sln in Visual Studio.

  2. Digitare F5 per eseguire l'app. L'app viene visualizzata nel browser predefinito.

    Nota

    Se Visual Studio e i prerequisiti sono stati installati solo, potrebbe essere necessario installare pacchetti mancanti tramite NuGet.

  3. Selezionare il collegamento Crea nuovo e creare due elementi Attività.

    New ASP.NET Project dialog box

  4. Testare i collegamenti Modifica, Dettagli ed Elimina.

L'app usa un contesto di database per connettersi al database. Nell'esempio il contesto di database usa una stringa di connessione denominata MyDbConnection. La stringa di connessione è impostata nel file Web.config e il file Models\MyDatabaseContext.cs include un riferimento alla stringa. Il nome della stringa di connessione viene usato più avanti nell'esercitazione per connettere l'app Azure a un database SQL di Azure.

Pubblicare un'applicazione ASP.NET in Azure

  1. In Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto DotNetAppSqlDb e selezionare Pubblica.

    Publish from Solution Explorer

  2. Selezionare Azure come destinazione e fare clic su Avanti.

  3. Assicurarsi che app Azure Servizio (Windows) sia selezionato e fare clic su Avanti.

Accedere e aggiungere un'app

  1. Nella finestra di dialogo Pubblica fare clic su Accedi.

  2. Accedere alla sottoscrizione di Azure. Se si è già connessi a un account Microsoft, verificare che l'account contenga la sottoscrizione di Azure. Se l'account Microsoft a cui si è connessi non include la sottoscrizione di Azure, fare clic su di esso per aggiungere l'account corretto.

  3. Nel riquadro delle istanze di servizio app fare clic su +.

    Sign in to Azure

Configurare il nome dell'app Web

È possibile mantenere il nome dell'app Web generato o modificarlo in un altro nome univoco (i caratteri validi sono a-z, 0-9 e -). Il nome dell'app Web viene usato come parte dell'URL predefinito per l'app (<app_name>.azurewebsites.net, dove <app_name> è il nome dell'app Web). Il nome dell'app Web deve essere univoco in tutte le app di Azure.

Nota

Non selezionare ancora Crea .

Create app service dialog

Creare un gruppo di risorse

Un gruppo di risorse è un contenitore logico in cui vengono distribuite e gestite risorse di Azure come app Web, database e account di archiviazione. Ad esempio, si può scegliere in un secondo momento di eliminare l'intero gruppo di risorse in un unico semplice passaggio.

  1. Accanto a Gruppo di risorse fare clic su Nuovo.

    Next to Resource Group, click New.

  2. Assegnare al gruppo di risorse il nome myResourceGroup.

Creare un piano di servizio app

Un piano di servizio app specifica la località, le dimensioni e le funzionalità della server farm Web che ospita l'app. Quando si ospitano più app, è possibile limitare i costi configurando le app Web in modo che condividano un singolo piano di servizio app.

I piani di servizio app definiscono:

  • Area (ad esempio Europa settentrionale, Stati Uniti orientali o Asia sud-orientale)
  • Dimensione dell'istanza (Small, Medium o Large)
  • Numero di scala (da 1 a 20 istanze)
  • SKU (Gratuito, Condiviso, Basic, Standard o Premium)
  1. Accanto a Piano di hosting fare clic su Nuovo.

  2. Nella finestra di dialogo Configura piano servizio app configurare il nuovo piano di servizio app con le impostazioni seguenti e fare clic su OK:

    Impostazione Valore suggerito Ulteriori informazioni
    Piano di servizio app myAppServicePlan Piani del servizio app
    Location Europa occidentale Aree di Azure
    Dimensione Disponibile Piani tariffari

    Create App Service plan

  3. Fare clic su Crea e attendere la creazione delle risorse di Azure.

  4. La finestra di dialogo Pubblica mostra le risorse configurate. Fare clic su Fine.

    the resources you've created

Creare un server e un database

Prima di creare un database è necessario un server SQL logico. Un server SQL logico è un costrutto logico che contiene un gruppo di database gestiti come gruppo.

  1. Nella finestra di dialogo Pubblica scorrere verso il basso fino alla sezione Dipendenze del servizio. Accanto a Database di SQL Server fare clic su Configura.

    Nota

    Assicurarsi di configurare il database SQL dalla pagina Pubblica anziché dalla pagina Servizi Connessione ed.

    Configure SQL Database dependency

  2. Selezionare database SQL di Azure e fare clic su Avanti.

  3. Nella finestra di dialogo Configura database SQL di Azure fare clic su +.

  4. Accanto a Server di database fare clic su Nuovo.

    Il nome del server viene usato come parte dell'URL predefinito per il server, <server_name>.database.windows.net. Deve essere univoco in tutti i server di Azure SQL. Modificare il nome del server in un valore desiderato.

  5. Aggiungere un nome utente e una password di amministratore. Per i requisiti di complessità delle password, vedere Criteri password.

    Prendere nota del nome utente e della password. Saranno necessari per gestire il server in un secondo momento.

    Create server

    Importante

    Anche se la password nelle stringhe di connessione è mascherata (sia in Visual Studio che nel servizio app), il fatto che venga mantenuta da qualche parte amplia la superficie di attacco dell'app. Il servizio app può usare identità del servizio gestito per eliminare tale rischio rimuovendo del tutto l'esigenza di mantenere i segreti nel codice o nella configurazione dell'app. Per altre informazioni, vedere Passaggi successivi.

  6. Fare clic su OK.

  7. Nella finestra di dialogo database SQL di Azure mantenere il nome del database generato predefinito. Selezionare Crea e attendere la creazione delle risorse del database.

    Configure database

Configurare la connessione al database

  1. Al termine della creazione delle risorse del database, fare clic su Avanti.

  2. In Nome stringa di connessione database digitare MyDb Connessione ion. Questo nome deve corrispondere alla stringa di connessione cui viene fatto riferimento in Models\MyDatabaseContext.cs.

  3. In Nome utente connessione database e Password di connessione database digitare il nome utente e la password dell'amministratore usati in Creare un server.

  4. Assicurarsi che app Azure Impostazioni sia selezionato e fare clic su Fine.

    Nota

    Se invece vengono visualizzati i file dei segreti utente locali, è necessario aver configurato database SQL dalla pagina Servizi Connessione ed anziché dalla pagina Pubblica.

    Configure database connection string

  5. Attendere il completamento della configurazione guidata e fare clic su Chiudi.

Distribuire l'app ASP.NET

  1. Nella scheda Pubblica scorrere verso l'alto fino alla parte superiore e fare clic su Pubblica. Dopo aver distribuito l'app ASP.NET in Azure. Il browser predefinito viene avviato con l'URL dell'app distribuita.

  2. Aggiungere alcune attività.

    Published ASP.NET application in Azure app

    Congratulazioni. L'applicazione ASP.NET basata sui dati è in esecuzione nel Servizio app di Azure.

Accedere al database in locale

Visual Studio consente di esplorare e gestire facilmente il nuovo database in Azure in SQL Server Esplora oggetti. Il nuovo database ha già aperto il firewall all'app servizio app creata. Tuttavia, per accedervi dal computer locale (ad esempio da Visual Studio), è necessario aprire un firewall per l'indirizzo IP pubblico del computer locale. Se il provider di servizi Internet modifica l'indirizzo IP pubblico, è necessario riconfigurare il firewall per accedere di nuovo al database di Azure.

Creare una connessione al database

  1. Dal menu Visualizza selezionare Esplora oggetti di SQL Server.

  2. Nella parte superiore di Esplora oggetti di SQL Server fare clic sul pulsante Aggiungi istanza di SQL Server.

Configurare la connessione al database

  1. Nella finestra di dialogo Connetti espandere il nodo Azure. Vengono visualizzate tutte le istanze del database SQL di Azure.

  2. Selezionare il database creato in precedenza. La connessione creata in precedenza viene inserita automaticamente nella parte inferiore.

  3. Digitare la password di amministratore di database creata in precedenza e fare clic su Connetti.

    Configure database connection from Visual Studio

Consentire la connessione client dal computer

Viene visualizzata la finestra di dialogo Crea nuova regola del firewall. Per impostazione predefinita, un server consente solo le connessioni ai relativi database dai servizi di Azure, ad esempio dall'app Azure. Per connettersi al database dall'esterno di Azure, creare una regola del firewall a livello di server. La regola del firewall autorizza l'indirizzo IP pubblico del computer locale.

Nella finestra di dialogo è già specificato l'indirizzo IP pubblico del computer.

  1. Assicurarsi che l'opzione Aggiungi IP client sia selezionata e fare clic su OK.

    Create firewall rule

    Dopo che Visual Studio ha completato la creazione dell'impostazione del firewall per l'istanza del database SQL, la connessione viene visualizzata in Esplora oggetti di SQL Server.

    In questa posizione è possibile eseguire le operazioni di database più comuni, ad esempio eseguire query, creare visualizzazioni e stored procedure e così via.

  2. Espandere la connessione >Database<>nelle tabelle di database.>> Fare clic con il pulsante destro del mouse sulla tabella Todoes e selezionare Visualizza dati.

    Explore SQL Database objects

Aggiornare l'app con Migrazioni Code First

Per aggiornare il database e l'app in Azure è possibile usare gli strumenti noti di Visual Studio. In questo passaggio si usa Migrazioni Code First di Entity Framework per apportare una modifica allo schema del database e pubblicarlo in Azure.

Per altre informazioni sull'uso di Migrazioni Code First di Entity Framework, vedere Getting Started with Entity Framework 6 Code First using MVC 5 (Introduzione a Code First di Entity Framework 6 con MVC 5).

Aggiornare il modello di dati

Aprire Models\Todo.cs nell'editor di codice. Aggiungere la proprietà seguente alla classe ToDo:

public bool Done { get; set; }

Eseguire Migrazioni Code First in locale

Eseguire alcuni comandi per eseguire gli aggiornamenti del database locale.

  1. Nel menu Strumenti fare clic su Gestione pacchetti NuGet>Console di Gestione pacchetti.

  2. Nella finestra Console di Gestione pacchetti abilitare le migrazioni Code First:

    Enable-Migrations
    
  3. Aggiungere una migrazione:

    Add-Migration AddProperty
    
  4. Aggiornare il database locale:

    Update-Database
    
  5. Digitare Ctrl+F5 per eseguire l'app. Testare i collegamenti Modifica, Dettagli e Crea.

Se l'applicazione viene caricata senza errori, l'esecuzione di Migrazioni Code First è stata completata. Tuttavia, la pagina rimane invariata perché la logica dell'applicazione non usa ancora questa nuova proprietà.

Usare la nuova proprietà

Apportare alcune modifiche al codice per usare la proprietà Done. Per motivi di semplicità in questa esercitazione vengono modificate solo le visualizzazioni Index e Create per visualizzare la proprietà.

  1. Aprire Controllers\TodosController.cs.

  2. Trovare il metodo Create() alla riga 52 e aggiungere Done all'elenco delle proprietà nell'attributo Bind. Al termine, la firma del metodo Create() è simile al codice seguente:

    public ActionResult Create([Bind(Include = "Description,CreatedDate,Done")] Todo todo)
    
  3. Aprire Views\Todos\Create.cshtml.

  4. Nel codice Razor viene visualizzato un elemento <div class="form-group"> che usa model.Description e quindi un altro elemento <div class="form-group"> che usa model.CreatedDate. Immediatamente dopo questi due elementi, aggiungere un altro elemento <div class="form-group"> che usa model.Done:

    <div class="form-group">
        @Html.LabelFor(model => model.Done, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            <div class="checkbox">
                @Html.EditorFor(model => model.Done)
                @Html.ValidationMessageFor(model => model.Done, "", new { @class = "text-danger" })
            </div>
        </div>
    </div>
    
  5. Aprire Views\Todos\Index.cshtml.

  6. cercare l'elemento <th></th> vuoto. Immediatamente sopra l'elemento, aggiungere il codice Razor seguente:

    <th>
        @Html.DisplayNameFor(model => model.Done)
    </th>
    
  7. Trovare l'elemento <td> che contiene i metodi helper Html.ActionLink(). Sopra questo <td>, aggiungere un altro elemento <td> con il codice Razor seguente:

    <td>
        @Html.DisplayFor(modelItem => item.Done)
    </td>
    

    Le modifiche verranno visualizzate nelle visualizzazioni Index e Create.

  8. Digitare Ctrl+F5 per eseguire l'app.

È ora possibile aggiungere un'attività e selezionare Fine. L'attività viene visualizzata come completata nella home page. Tenere presente che la visualizzazione Edit non mostra il campo Done poiché non è stata modificata la visualizzazione Edit.

Abilitare Migrazioni Code First in Azure

Dopo aver completato la modifica al codice, inclusa la migrazione del database, è possibile eseguire la pubblicazione nell'app Azure e aggiornare anche il database SQL con Migrazioni Code First.

  1. Fare di nuovo clic con il pulsante destro del mouse sul progetto e selezionare Pubblica.

  2. Fare clic su Altre azioni>Modifica per aprire le impostazioni di pubblicazione.

    Open publish settings

  3. Nell'elenco a discesa MyDatabaseContext selezionare la connessione al database per il database SQL di Azure.

  4. Selezionare Esegui migrazione primo codice (inizia all'avvio dell'applicazione), quindi fare clic su Salva.

    Enable Code First Migrations in Azure app

Pubblicare le modifiche

Dopo aver abilitato Migrazioni Code First nell'app Azure pubblicare le modifiche al codice.

  1. Nella pagina di pubblicazione fare clic su Pubblica.

  2. Provare di nuovo ad aggiungere attività e selezionare Fine. Le attività verranno visualizzate nella home page come completate.

    Azure app after Code First Migration

Tutte le attività esistenti rimangono visualizzate. Quando si ripubblica l'applicazione ASP.NET, i dati esistenti nella database SQL non andranno persi. Inoltre, solo Migrazioni Code First modifica lo schema dei dati lasciando intatti i dati esistenti.

Eseguire lo streaming dei log delle applicazioni

È possibile eseguire lo streaming dei messaggi di traccia direttamente dall'app Azure in Visual Studio.

Aprire Controllers\TodosController.cs.

Ogni azione inizia con un metodo Trace.WriteLine(). Questo codice viene aggiunto per illustrare come aggiungere messaggi di traccia all'app Azure.

Abilitare lo streaming dei log

  1. Nella pagina di pubblicazione scorrere verso il basso fino alla sezione Hosting .

  2. Nell'angolo destro fare clic su ...>Visualizzare i log di streaming.

    Enable log streaming

    Lo streaming dei log viene eseguito nella finestra Output.

    Log streaming in Output window

    I messaggi di traccia tuttavia non sono ancora visibili. Ciò avviene perché la prima volta che si seleziona Visualizza log in streaming l'app Azure imposta il livello di traccia su Error che comporta soltanto la registrazione degli eventi di errore (con il metodo Trace.TraceError()).

Modificare i livelli di traccia

  1. Per modificare i livelli di traccia in modo da restituire altri messaggi di traccia, tornare alla pagina di pubblicazione.

  2. Nella sezione Hosting fare clic su ...>Aprire in portale di Azure.

  3. Nella pagina di gestione del portale per l'app selezionare servizio app log dal menu a sinistra.

  4. In Registrazione applicazioni (file system) selezionare Dettagliato in Livello. Fare clic su Salva.

    Suggerimento

    È possibile provare i diversi livelli di traccia per verificare i tipi di messaggi visualizzati per ogni livello. Ad esempio, il livello Informazioni include tutti i log creati da Trace.TraceInformation(), Trace.TraceWarning() e Trace.TraceError(), ma non i log creati da Trace.WriteLine().

  5. Nel browser passare di nuovo all'app http://< nome app.azurewebsites.net>, quindi provare a fare clic sull'applicazione elenco attività in Azure. Viene eseguito lo streaming dei messaggi di traccia nella finestra Output in Visual Studio.

    Application: 2017-04-06T23:30:41  PID[8132] Verbose     GET /Todos/Index
    Application: 2017-04-06T23:30:43  PID[8132] Verbose     GET /Todos/Create
    Application: 2017-04-06T23:30:53  PID[8132] Verbose     POST /Todos/Create
    Application: 2017-04-06T23:30:54  PID[8132] Verbose     GET /Todos/Index
    

Arrestare lo streaming dei log

Per arrestare il servizio di streaming dei log, fare clic sul pulsante Interrompi monitoraggio nella finestra Output.

Stop log streaming

Pulire le risorse

Nei passaggi precedenti sono state create risorse di Azure in un gruppo di risorse. Se non si prevede di aver bisogno di queste risorse in futuro, è possibile eliminarle eliminando il gruppo di risorse.

  1. Dalla pagina Panoramica dell'app Web nel portale di Azure selezionare il collegamento myResourceGroup in Gruppo di risorse.
  2. Nella pagina del gruppo di risorse assicurarsi che le risorse elencate siano quelle da eliminare.
  3. Selezionare Elimina, digitare myResourceGroup nella casella di testo e quindi selezionare Elimina.

Passaggi successivi

Questa esercitazione ha descritto come:

  • Creare un database nel database SQL di Azure
  • Connettere un'app ASP.NET al database SQL
  • Distribuire l'app in Azure
  • Aggiornare il modello di dati e ridistribuire l'app
  • Eseguire lo streaming dei log da Azure al terminale

Passare all'esercitazione successiva per apprendere come migliorare facilmente la sicurezza della connessione al database SQL di Azure.

Altre risorse:

Si vuole ottimizzare e risparmiare sulla spesa per il cloud?