Übung: Erstellen einer Azure Functions-App und Umgestalten des Codes
In dieser Übung erstellen Sie eine serverlose Azure Functions-Anwendung, mit der die APIs anstelle der Express-Anwendung ausgeführt werden. Anschließend migrieren Sie die Anwendungslogik von der Node.js Express-Anwendung zur Functions-Anwendung. Dazu müssen Sie den Code nicht neu schreiben. Für die Umgestaltung sind nur ein paar kleine Codeänderungen erforderlich.
Erstellen einer neuen Azure Functions-App
Vergewissern Sie sich, dass die Visual Studio Code-Erweiterung für Azure Functions installiert ist.
Öffnen Sie in Visual Studio Code die Befehlspalette, indem Sie F1 drücken.
Geben Sie Azure Functions: Neues Projekt erstellen ein, und wählen Sie die Option aus.
Wählen Sie den Stamm des Repositorys als den Speicherort für das neue Projekt aus.
Geben Sie nach Aufforderung die folgenden Werte ein.
Name Wert Sprache TypeScript Auswählen eines TypeScript-Programmiermodells Modell V4 Vorlage HTTP-Trigger Name getVacations
Die Functions-App wird nun für die API-Endpunkte der Anwendung erstellt. In der nächsten Lerneinheit erstellen Sie die Funktionen, mit denen Urlaubsziele aufgelistet, hinzugefügt, aktualisiert und gelöscht werden.
Hinweis
Sie haben die Functions-App im Ordner functions erstellt, der sie von der Angular-App trennt. Sie können selbst entscheiden, wie Sie Ihre Anwendungen strukturieren. Zu Lernzwecken empfiehlt es sich jedoch, beide Apps an einem Ort zu speichern.
Kopieren und Umgestalten des Routenhandlercodes
Die gesamte Node.js Express-Logik zum Zurückgeben von Daten befindet sich im Ordner server/services. Sie können diesen Code aus der Node.js Express-Anwendung in die Functions-Anwendung kopieren und dann geringfügig umgestalten, sodass der Code mit Functions statt mit Node.js Express verwendet werden kann.
In der folgenden Tabelle sind die Hauptunterschiede zwischen der Node.js Express-Anwendung und der Functions-Anwendung aufgeführt:
Komponente | Node.js Express | Functions |
---|---|---|
Importiertes npm-Paket für die Anwendung | express |
@azure/functions |
Anforderungs- und Antwortobjekte | req und res |
request und context |
Zunächst gestalten Sie den Code so um, dass damit das entsprechende npm-Paket importiert wird. Anschließend gestalten Sie den Code so um, dass die Unterschiede zwischen Express und Functions bei der Übergabe der Anforderungs- und Antwortobjekte berücksichtigt werden.
Kopieren über den vorhandenen Code aus dem Express-Projekt
Kopieren Sie in Visual Studio Code die folgenden Unterordner aus dem Ordner server in der Express-Anwendung, und fügen Sie diese in den Ordner functions/ ein:
- data
- Modelle
- services
Sie müssen den Ordner routes nicht kopieren, da Sie neue Funktionen für jede Route in der Azure Functions-App erstellen werden.
Fahren Sie mit der nächsten Lerneinheit fort, um die Funktionen zu erstellen und die Endpunkte und Routen umzugestalten.