Tutorial: Bereitstellen einer ASP.NET-App in Azure mit Azure SQL-Datenbank

Von Azure App Service wird ein hochgradig skalierbarer Webhostingdienst mit Self-Patching bereitgestellt. In diesem Tutorial wird veranschaulicht, wie Sie eine datengesteuerte ASP.NET-App in App Service bereitstellen und dafür eine Verbindung mit Azure SQL-Datenbank herstellen. Nach Abschluss verfügen Sie über eine ASP.NET-App, die in Azure ausgeführt wird und mit SQL-Datenbank verbunden ist.

Published ASP.NET application in Azure App Service

In diesem Tutorial lernen Sie Folgendes:

  • Erstellen einer Datenbank in Azure SQL-Datenbank
  • Herstellen einer Verbindung mit SQL-Datenbank für eine ASP.NET-App
  • Bereitstellen der Anwendung in Azure
  • Aktualisieren des Datenmodells und erneutes Bereitstellen der App
  • Streamen von Protokollen von Azure auf Ihr Terminal

Wenn Sie kein Azure-Abonnement haben, erstellen Sie ein kostenloses Azure-Konto, bevor Sie beginnen.

Voraussetzungen

Für dieses Tutorial benötigen Sie Folgendes:

Installieren Sie Visual Studio 2022 mit den Workloads ASP.NET und Webentwicklung und Azure-Entwicklung.

Falls Sie Visual Studio bereits installiert haben, können Sie die Workloads in Visual Studio hinzufügen, indem Sie auf Extras>Get Tools and Features (Tools und Features abrufen) klicken.

Herunterladen des Beispiels

  1. Laden Sie das Beispielprojekt herunter.

  2. Extrahieren (entzippen) Sie die Datei dotnet-sqldb-tutorial-master.zip.

Das Beispielprojekt enthält eine einfache ASP.NET MVC-CRUD-App (Create-Read-Update-Delete, Erstellen-Lesen-Aktualisieren-Löschen), die auf Entity Framework Code First basiert.

Ausführen der App

  1. Öffnen Sie die Datei dotnet-sqldb-tutorial-master/DotNetAppSqlDb.sln in Visual Studio.

  2. Drücken Sie F5, um die App auszuführen. Die App wird im Standardbrowser angezeigt.

    Hinweis

    Wenn Sie nur Visual Studio und die erforderlichen Komponenten installiert haben, müssen Sie möglicherweise fehlende Pakete über NuGet installieren.

  3. Wählen Sie den Link Neu erstellen, und erstellen Sie einige Aufgaben-Elemente.

    New ASP.NET Project dialog box

  4. Testen Sie die Links Bearbeiten, Details und Löschen.

Die App nutzt einen Datenbankkontext, um die Verbindung mit der Datenbank herzustellen. In diesem Beispiel wird im Datenbankkontext eine Verbindungszeichenfolge mit dem Namen MyDbConnection verwendet. Die Verbindungszeichenfolge wird in der Datei Web.config festgelegt, und die Datei Models/MyDatabaseContext.cs enthält einen Verweis darauf. Der Name der Verbindungszeichenfolge wird später im Tutorial verwendet, um die Azure-App mit einer Azure SQL-Datenbank zu verbinden.

Veröffentlichen einer ASP.NET-Anwendung in Azure

  1. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf das Projekt DotNetAppSqlDb, und wählen Sie Veröffentlichen aus.

    Publish from Solution Explorer

  2. Wählen Sie als Ziel Azure aus, und klicken Sie auf Weiter.

  3. Vergewissern Sie sich, dass Azure App Service (Windows) ausgewählt ist, und klicken Sie auf Veröffentlichen.

Anmelden und Hinzufügen einer App

  1. Klicken Sie im Dialogfeld Veröffentlichen auf Anmelden.

  2. Melden Sie sich bei Ihrem Azure-Abonnement an. Falls Sie bereits bei einem Microsoft-Konto angemeldet sind, vergewissern Sie sich, dass dieses Konto Ihr Azure-Abonnement enthält. Wenn das Microsoft-Konto, bei dem Sie angemeldet sind, nicht Ihr Azure-Abonnement enthält, klicken Sie darauf, um das korrekte Konto hinzuzufügen.

  3. Klicken Sie im Bereich App Service-Instanzen auf +.

    Sign in to Azure

Konfigurieren des Web-App-Namens

Sie können den generierten Web-App-Namen beibehalten oder in einen anderen eindeutigen Namen ändern (gültige Zeichen a-z, 0-9 und -). Der Web-App-Name wird als Teil der Standard-URL für Ihre App verwendet (<app_name>.azurewebsites.net, wobei <app_name> Ihr Web-App-Name ist). Der Web-App-Name muss in Azure über alle Apps hinweg eindeutig sein.

Hinweis

Wählen Sie noch nicht Erstellen aus.

Create app service dialog

Erstellen einer Ressourcengruppe

Eine Ressourcengruppe ist ein logischer Container, in dem Azure-Ressourcen wie Web-Apps, Datenbanken und Speicherkonten bereitgestellt und verwaltet werden. Sie können z.B. die gesamte Ressourcengruppe später in einem einfachen Schritt löschen.

  1. Klicken Sie neben Ressourcengruppe auf Neu.

    Next to Resource Group, click New.

  2. Geben Sie der Ressourcengruppe den Namen myResourceGroup.

Wie erstelle ich einen Plan?

Ein App Service-Plan gibt den Standort, die Größe und die Funktionen der Webserverfarm an, die Ihre App hostet. Beim Hosten mehrerer Apps können Sie Geld sparen, indem Sie die Web-Apps für die gemeinsame Verwendung eines einzelnen App Service-Plans konfigurieren.

In App Service-Plänen wird Folgendes definiert:

  • Region (z.B. „Europa, Norden“, „USA, Osten“ oder „Asien, Südosten“)
  • Instanzgröße (klein, mittel, groß)
  • Skalierung (1 bis 20 Instanzen)
  • SKU (Free, Shared, Basic, Standard oder Premium)
  1. Klicken Sie neben Hostingplan auf Neu.

  2. Konfigurieren Sie den neuen App Service-Plan im Dialogfeld App Service-Plan konfigurieren mit den folgenden Einstellungen, und klicken Sie auf OK:

    Einstellung Vorgeschlagener Wert Weitere Informationen finden Sie unter
    App Service-Plan myAppServicePlan App Service-Pläne
    Location Europa, Westen Azure-Regionen
    Größe Kostenlos Tarife

    Create App Service plan

  3. Klicken Sie auf Erstellen, und warten Sie, bis die Azure-Ressourcen erstellt werden.

  4. Im Dialogfeld Veröffentlichen werden die von Ihnen konfigurierten Ressourcen angezeigt. Klicken Sie auf Fertig stellen.

    the resources you've created

Erstellen eines Servers und einer Datenbank

Bevor Sie eine Datenbank erstellen, benötigen Sie einen logischen SQL-Server. Ein logischer Server ist ein logisches Konstrukt, das eine Gruppe von Datenbanken enthält, die als Gruppe verwaltet werden.

  1. Scrollen Sie im Dialogfeld Veröffentlichen nach unten zum Abschnitt Dienstabhängigkeiten. Klicken Sie neben SQL Server-Datenbank auf Konfigurieren.

    Hinweis

    Stellen Sie sicher, dass Sie die SQL-Datenbank auf der Seite Veröffentlichen und nicht auf der Seite Verbundene Dienste konfigurieren.

    Configure SQL Database dependency

  2. Wählen Sie Azure SQL-Datenbank aus, und klicken Sie auf Weiter.

  3. Klicken Sie im Dialogfeld Azure SQL-Datenbank konfigurieren auf +.

  4. Klicken Sie neben Datenbankserver auf Neu.

    Dieser Servername wird als Teil der Standard-URL für Ihren Server <server_name>.database.windows.net verwendet. Er muss in Azure SQL über alle Server hinweg eindeutig sein. Ändern Sie den Servernamen bei Bedarf.

  5. Fügen Sie den Benutzernamen und das Kennwort eines Administrators hinzu. Informationen zu den Anforderungen an die Komplexität von Kennwörtern finden Sie unter Kennwortrichtlinie.

    Merken Sie sich diesen Benutzernamen und das Kennwort. Sie benötigen diese Angaben später zum Verwalten des Servers.

    Create server

    Wichtig

    Ihr Kennwort ist in den Verbindungszeichenfolgen zwar maskiert (sowohl in Visual Studio als auch in App Service), aber allein die Tatsache, dass es irgendwo gespeichert ist, macht die App bereits anfälliger für Angriffe. App Service kann dieses Risiko durch die Verwendung verwalteter Dienstidentitäten beseitigen, da Geheimnisse dann nicht mehr im Code oder in der App-Konfiguration gespeichert werden müssen. Weitere Informationen finden Sie in den nächsten Schritten.

  6. Klicken Sie auf OK.

  7. Behalten Sie im Dialogfeld Azure SQL-Datenbank den standardmäßig generierten Datenbanknamen bei. Wählen Sie Erstellen aus, und warten Sie, bis die Datenbankressourcen erstellt werden.

    Configure database

Konfigurieren der Datenbankverbindung

  1. Wenn der Assistent die Erstellung der Datenbankressourcen abgeschlossen hat, klicken Sie auf Weiter.

  2. Geben Sie unter Name der Datenbankverbindungszeichenfolge die Zeichenfolge MyDbConnection ein. Dieser Name muss mit der Verbindungszeichenfolge übereinstimmen, auf die in Models/MyDatabaseContext.cs verwiesen wird.

  3. Geben Sie unter Benutzername für Datenbankverbindung und Kennwort für Datenbankverbindung den Benutzernamen und das Kennwort des Administrators ein, die Sie unter Erstellen eines Servers verwendet haben.

  4. Vergewissern Sie sich, dass Azure-App-Einstellungen ausgewählt ist, und klicken Sie auf Fertig stellen.

    Hinweis

    Wenn stattdessen Local user secrets files (Dateien mit lokalen Benutzergeheimnissen) angezeigt wird, haben Sie SQL-Datenbank über die Seite Verbundene Dienste und nicht über die Seite Veröffentlichen konfiguriert.

    Configure database connection string

  5. Warten Sie, bis der Konfigurations-Assistent abgeschlossen ist, und klicken Sie auf Schließen.

Bereitstellen der ASP.NET-App

  1. Scrollen Sie auf der Registerkarte Veröffentlichen nach oben, und klicken Sie auf Veröffentlichen. Nach der Bereitstellung Ihrer ASP.NET-App in Azure Ihr Standardbrowser wird mit der URL für die bereitgestellte App gestartet.

  2. Fügen Sie einige Aufgaben hinzu.

    Published ASP.NET application in Azure app

    Herzlichen Glückwunsch! Ihre datengesteuerte ASP.NET-Anwendung wird live in Azure App Service ausgeführt.

Lokaler Zugriff auf die Datenbank

Mit Visual Studio können Sie Ihre neue Datenbank in Azure bequem im SQL Server-Objekt-Explorer überprüfen und verwalten. Die neue Datenbank hat ihre Firewall bereits für die App Service-App geöffnet, die Sie erstellt haben. Sie müssen die Firewall jedoch auch für die öffentliche IP-Adresse Ihres lokalen Computers öffnen, um von Ihrem lokalen Computer aus (z. B. über Visual Studio) darauf zuzugreifen. Wenn Ihre öffentliche IP-Adresse von Ihrem Internetdienstanbieter geändert wird, müssen Sie die Firewall neu konfigurieren, um auf die Azure-Datenbank zugreifen zu können.

Erstellen einer Datenbankverbindung

  1. Wählen Sie im Menü Ansicht die Option SQL Server-Objekt-Explorer.

  2. Klicken Sie oben im SQL Server-Objekt-Explorer auf die Schaltfläche SQL Server hinzufügen.

Konfigurieren der Datenbankverbindung

  1. Erweitern Sie im Dialogfeld Verbinden den Knoten Azure. Hier sind alle Ihre Instanzen von SQL-Datenbank in Azure aufgeführt.

  2. Wählen Sie die Datenbank aus, die Sie zuvor erstellt haben. Die Verbindung, die Sie zuvor erstellt haben, wird automatisch im unteren Bereich angezeigt.

  3. Geben Sie das Administratorkennwort für die Datenbank ein, das Sie zuvor erstellt haben, und klicken Sie auf Verbinden.

    Configure database connection from Visual Studio

Zulassen der Clientverbindung auf dem Computer

Das Dialogfeld zum Erstellen einer neuen Firewallregelwird angezeigt. Standardmäßig lässt ein Server nur Verbindungen von Azure-Diensten wie Ihrer Azure-App mit seiner Datenbank zu. Erstellen Sie zum Herstellen einer Verbindung mit Ihrer Datenbank von außerhalb von Azure aus eine Firewallregel auf Serverebene. Mit der Firewallregel wird die öffentliche IP-Adresse Ihres lokalen Computers zugelassen.

Das Dialogfeld ist bereits mit der öffentlichen IP-Adresse des Computers ausgefüllt.

  1. Stellen Sie sicher, dass Meine IP-Clientadresse hinzufügen ausgewählt ist, und klicken Sie auf OK.

    Create firewall rule

    Sobald das Erstellen der Firewalleinstellung in Visual Studio für die SQL-Datenbankinstanz abgeschlossen wurde, wird die Verbindung im SQL Server-Objekt-Explorer angezeigt.

    Hier können Sie häufige Datenbankvorgänge ausführen, und z.B. Abfragen ausführen, Ansichten und gespeicherte Prozeduren erstellen usw.

  2. Erweitern Sie Ihre Verbindung unter >Datenbanken><Ihre Datenbank>>Tabellen. Klicken Sie mit der rechten Maustaste auf die Tabelle Todoes, und wählen Sie Daten anzeigen.

    Explore SQL Database objects

Aktualisieren der App mit Code First-Migrationen

Sie können die vertrauten Tools in Visual Studio verwenden, um Ihre Datenbank und App in Azure zu aktualisieren. In diesem Schritt verwenden Sie Code First-Migrationen in Entity Framework, um eine Änderung am Datenbankschema vorzunehmen und sie in Azure zu veröffentlichen.

Weitere Informationen zur Verwendung von Entity Framework Code First-Migrationen finden Sie unter Getting Started with Entity Framework 6 Code First using MVC 5 (Erste Schritte mit Entity Framework 6 Code First per MVC 5).

Aktualisieren Sie des Datenmodells

Öffnen Sie Models\Todo.cs im Code-Editor. Fügen Sie der ToDo-Klasse die folgende Eigenschaft hinzu:

public bool Done { get; set; }

Lokales Ausführen von Code First-Migrationen

Führen Sie einige Befehle aus, um Aktualisierungen an Ihrer lokalen Datenbank vorzunehmen.

  1. Klicken Sie im Menü Extras auf NuGet-Paket-Manager>Paket-Manager-Konsole.

  2. Aktivieren Sie im Fenster „Paket-Manager-Konsole“ Code First-Migrationen:

    Enable-Migrations
    
  3. Fügen Sie eine Migration hinzu:

    Add-Migration AddProperty
    
  4. Aktualisieren Sie die lokale Datenbank:

    Update-Database
    
  5. Drücken Sie Ctrl+F5, um die App auszuführen. Testen Sie die Links „Bearbeiten“, „Details“ und „Erstellen“.

Wenn die Anwendung ohne Fehler geladen wird, waren die Code First-Migrationen erfolgreich. Allerdings wird die Seite noch genauso angezeigt, weil die Anwendungslogik noch nicht die neue Eigenschaft verwendet.

Verwenden der neuen Eigenschaft

Nehmen Sie einige Änderungen an Ihrem Code vor, um die Done-Eigenschaft zu verwenden. Der Einfachheit halber ändern Sie in diesem Lernprogramm nur Ansichten Index und Create, um die Eigenschaft in Aktion zu sehen.

  1. Öffnen Sie Controllers\TodosController.cs.

  2. Suchen Sie die Create()-Methode in Zeile 52, und fügen Sie Done zur Liste der Eigenschaften im Bind-Attribut hinzu. Anschließend sieht Ihre Create()-Methodensignatur wie im folgenden Code aus:

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

  4. Im Razor-Code sollten Sie ein <div class="form-group">-Element sehen, das model.Description verwendet, sowie ein weiteres <div class="form-group">-Element, das model.CreatedDate verwendet. Fügen Sie direkt nach diesen beiden Elementen ein weiteres <div class="form-group">-Element hinzu, für das model.Done genutzt wird:

    <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. Öffnen Sie Views\Todos\Index.cshtml.

  6. Suchen Sie nach dem leeren <th></th>-Element. Fügen Sie direkt oberhalb dieses Elements den folgenden Razor-Code hinzu:

    <th>
        @Html.DisplayNameFor(model => model.Done)
    </th>
    
  7. Suchen Sie nach dem <td>-Element, das die Html.ActionLink()-Hilfsmethoden enthält. Fügen Sie über diesem <td> ein weiteres <td>-Element mit folgendem Razor-Code hinzu:

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

    Mehr ist nicht erforderlich, um die Änderungen in den Ansichten Index und Create anzuzeigen.

  8. Drücken Sie Ctrl+F5, um die App auszuführen.

Sie können jetzt eine Aufgabe hinzufügen und die Option Fertig aktivieren. Die Aufgabe sollte dann auf der Startseite als erledigt angezeigt werden. Beachten Sie, dass in der Ansicht Edit das Feld Done nicht angezeigt wird, da Sie die Ansicht Edit nicht geändert haben.

Aktivieren von Code First-Migrationen in Azure

Da die Codeänderung, einschließlich der Datenbankmigration, funktioniert, können Sie sie in Ihrer Azure-App veröffentlichen und die SQL-Datenbank ebenfalls mit Code First-Migrationen aktualisieren.

  1. Klicken Sie wie zuvor mit der rechten Maustaste auf Ihr Projekt, und wählen Sie Veröffentlichen aus.

  2. Klicken Sie auf Weitere Aktionen>Bearbeiten, um die Veröffentlichungseinstellungen zu öffnen.

    Open publish settings

  3. Wählen Sie in der Dropdownliste MyDatabaseContext die Datenbankverbindung für Ihre Azure SQL-Datenbank-Instanz aus.

  4. Wählen Sie Code First-Migrationen ausführen (wird beim Anwendungsstart ausgeführt) aus, und klicken Sie auf Speichern.

    Enable Code First Migrations in Azure app

Veröffentlichen der Änderungen

Nachdem Sie Code First-Migrationen in der Azure-App aktiviert haben, können Sie die Änderungen am Code veröffentlichen.

  1. Klicken Sie auf der Veröffentlichungsseite auf Veröffentlichen.

  2. Versuchen Sie erneut, Aufgaben hinzuzufügen, und wählen Sie Fertig aus. Sie sollten auf der Startseite als abgeschlossene Aufgaben angezeigt werden.

    Azure app after Code First Migration

Ihre gesamten vorhandenen Aufgaben werden weiterhin angezeigt. Wenn Sie die ASP.NET-Anwendung erneut veröffentlichen, gehen in der SQL-Datenbank vorhandene Daten nicht verloren. Außerdem wird durch Code First-Migrationen nur das Datenschema geändert, die vorhandenen Daten bleiben unverändert.

Streamen von Anwendungsprotokollen

Sie können Ablaufverfolgungsmeldungen direkt aus der Azure-App in Visual Studio streamen.

Öffnen Sie Controllers\TodosController.cs.

Jede Aktion beginnt mit einer Trace.WriteLine()-Methode. Dieser Code wird hinzugefügt, um zu zeigen, wie Sie Ihrer Azure-App Ablaufverfolgungsnachrichten hinzufügen können.

Aktivieren des Protokollstreamings

  1. Scrollen Sie auf der Seite „Veröffentlichen“ nach unten zum Abschnitt Hosting.

  2. Klicken Sie in der rechten Ecke auf ...>Streamingprotokolle anzeigen.

    Enable log streaming

    Die Protokolle werden jetzt in das Ausgabefenster gestreamt.

    Log streaming in Output window

    Es werden allerdings noch keine Ablaufverfolgungsmeldungen angezeigt. Das liegt daran, dass beim ersten Auswählen von Streamingprotokolle anzeigen die Azure-App die Ablaufverfolgungsebene auf Error festlegt, womit nur Fehlerereignisse protokolliert werden (mit der Trace.TraceError()-Methode).

Ändern der Ablaufverfolgungsebenen

  1. Wenn Sie die Ablaufverfolgungsebenen ändern möchten, um andere Ablaufverfolgungsmeldungen auszugeben, wechseln Sie zurück zur Seite „Veröffentlichen“.

  2. Klicken Sie im Abschnitt Hosting auf ...>Im Azure-Portal öffnen.

  3. Wählen Sie auf der Portalverwaltungsseite für Ihre App im Menü auf der linken Seite App Service-Protokolle aus.

  4. Wählen Sie unter Anwendungsprotokollierung (Dateisystem) unter Ebene die Option Ausführlich aus. Klicken Sie auf Speichern.

    Tipp

    Sie können mit verschiedenen Ablaufverfolgungsebenen experimentieren, um zu sehen, welche Nachrichten für die jeweiligen Ebenen angezeigt werden. Bei der Ebene Informationen werden alle von Trace.TraceInformation(), Trace.TraceWarning() und Trace.TraceError() erstellten Protokolle eingeschlossen, aber keine Protokolle, die von Trace.WriteLine() erstellt wurden.

  5. Navigieren Sie in Ihrem Browser erneut zu Ihrer App unter http://<Ihr App-Name>.azurewebsites.net, und versuchen Sie, auf die Anwendung „To-Do-Liste“ in Azure zu klicken. Die Ablaufverfolgungsmeldungen werden jetzt in das Ausgabefensterin Visual Studio gestreamt.

    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
    

Beenden des Protokollstreamings

Klicken Sie zum Beenden des Diensts für das Protokollstreaming auf die Schaltfläche Überwachung beenden im Ausgabefenster.

Stop log streaming

Bereinigen von Ressourcen

In den vorherigen Schritten haben Sie Azure-Ressourcen in einer Ressourcengruppe erstellt. Wenn Sie diese Ressourcen in Zukunft nicht mehr benötigen, können Sie sie löschen, indem Sie die Ressourcengruppe löschen.

  1. Wählen Sie auf der Seite „Übersicht“ Ihrer Web-App im Azure-Portal den Link myResourceGroup unter Ressourcengruppe aus.
  2. Vergewissern Sie sich, dass es sich bei den auf der Seite „Ressourcengruppe“ aufgeführten Ressourcen wirklich um die Ressourcen handelt, die gelöscht werden sollen.
  3. Klicken Sie auf Löschen, geben Sie myResourceGroup in das Textfeld ein, und klicken Sie anschließend erneut auf Löschen.

Nächste Schritte

In diesem Tutorial haben Sie Folgendes gelernt:

  • Erstellen einer Datenbank in Azure SQL-Datenbank
  • Herstellen einer Verbindung mit SQL-Datenbank für eine ASP.NET-App
  • Bereitstellen der Anwendung in Azure
  • Aktualisieren des Datenmodells und erneutes Bereitstellen der App
  • Streamen von Protokollen von Azure auf Ihr Terminal

Im nächsten Tutorial erfahren Sie, wie Sie ganz einfach die Sicherheit Ihrer Verbindung mit Azure SQL-Datenbank verbessern.

Weitere Ressourcen:

Möchten Sie Ihre Cloudausgaben optimieren und dabei sparen?