Kurzanleitung: Angular SSR-Dienst in Cloud Run bereitstellen

Kurzanleitung: Angular SSR-Dienst in Cloud Run bereitstellen

Erfahren Sie, wie Sie eine einfache Hello World-Anwendung erstellen, in ein Container-Image verpacken, das Container-Image in Artifact Registry hochladen und anschließend in Cloud Run bereitstellen.

Hinweise

1. Sign in to your Google Cloud account. If you're new to Google Cloud, create an account to evaluate how our products perform in real-world scenarios. New customers also get $300 in free credits to run, test, and deploy workloads.

2. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

   Note: If you don't plan to keep the resources that you create in this procedure, create a project instead of selecting an existing project. After you finish these steps, you can delete the project, removing all resources associated with the project.

   Go to project selector

3. Make sure that billing is enabled for your Google Cloud project.

4. Install the Google Cloud CLI.

5. To initialize the gcloud CLI, run the following command:

   gcloud init

   Note: If you installed the gcloud CLI previously, make sure you have the latest version by running gcloud components update.

6. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

   Note: If you don't plan to keep the resources that you create in this procedure, create a project instead of selecting an existing project. After you finish these steps, you can delete the project, removing all resources associated with the project.

   Go to project selector

7. Make sure that billing is enabled for your Google Cloud project.

8. Install the Google Cloud CLI.

9. To initialize the gcloud CLI, run the following command:

   gcloud init

   Note: If you installed the gcloud CLI previously, make sure you have the latest version by running gcloud components update.
10. So legen Sie das Standardprojekt für Ihren Cloud Run-Dienst fest:

     gcloud config set project PROJECT_ID

    Ersetzen Sie PROJECT_ID durch den Namen des Projekts, das Sie für diese Kurzanleitung erstellt haben.
11. Wenn Node.js 20 oder höher nicht installiert ist, installieren Sie Node.js.

12. Wenn Sie einer Domaineinschränkung zur Organisation nicht eingeschränkter Aufrufe für Ihr Projekt unterliegen, müssen Sie auf Ihren bereitgestellten Dienst zugreifen, wie unter Private Dienste testen beschrieben.

13. Aktivieren Sie die Cloud Run Admin API:

    gcloud services enable run.googleapis.com
    

    Nachdem die Cloud Run Admin API aktiviert wurde, wird das Compute Engine-Standarddienstkonto automatisch erstellt.

14. Damit Cloud Build Ihre Quellen erstellen kann, müssen Sie dem Compute Engine-Standarddienstkonto die Rolle Cloud Build-Dienstkonto zuweisen. Führen Sie dazu Folgendes aus:

    gcloud projects add-iam-policy-binding PROJECT_ID \
        --member=serviceAccount:[e-mail] \
        --role=roles/cloudbuild.builds.builder
    

    Ersetzen Sie PROJECT_NUMBER durch Ihre Google Cloud-Projektnummer und PROJECT_ID durch Ihre Google Cloud-Projekt-ID.

    Sie finden sowohl Ihre Projektnummer als auch Ihre Projekt-ID auf der Willkommensseite der Google Cloud Console.

    Hinweis:

    Die Einschränkung für die Organisationsrichtlinie iam.automaticIamGrantsForDefaultServiceAccounts verhindert, dass die Rolle „Bearbeiter“ automatisch Standarddienstkonten zugewiesen wird. Wenn Sie Ihre Organisation nach dem 3. Mai 2024 erstellt haben, wird diese Einschränkung standardmäßig erzwungen.

    Wir empfehlen dringend, diese Einschränkung zu erzwingen, um die automatische Rollenzuweisung zu deaktivieren. Wenn Sie die automatische Rollenzuweisung deaktivieren, müssen Sie entscheiden, welche Rollen den Standarddienstkonten zugeteilt werden sollen, und diese Rollen dann selbst zuweisen.

    Wenn das Standarddienstkonto bereits die Rolle "Bearbeiter" hat, sollten Sie die Rolle "Bearbeiter" durch weniger strikte Rollen ersetzen. Verwenden Sie zum sicheren Ändern der Rollen des Dienstkontos Policy Simulator, um die Auswirkungen der Änderung zu sehen, und weisen Sie die entsprechenden Rollen zu und widerrufen Sie sie.

Beispieldienst schreiben

So erstellen Sie einen Angular SSR-Dienst und stellen ihn bereit:

1. Verwenden Sie den folgenden Befehl, um ein neues Angular SSR-Projekt mit dem Namen helloworld zu erstellen:

   npx @angular/cli@17.3.6 new helloworld --ssr
   

   Drücken Sie Enter, wenn Sie dazu aufgefordert werden, die Standardeinstellungen zu übernehmen.

2. Ändern Sie das Verzeichnis in helloworld:

   cd helloworld
   

Die Anwendung ist fertig und kann bereitgestellt werden.

Für Cloud Run aus Quelle bereitstellen

Wichtig: In dieser Kurzanleitung wird davon ausgegangen, dass Sie Inhaber- oder Bearbeiterrollen in dem Projekt haben, das Sie für die Kurzanleitung verwenden. Andernfalls finden Sie in der Rolle „Cloud Run Source Developer“ die erforderlichen Berechtigungen zum Bereitstellen einer Cloud Run-Ressource aus der Quelle.

Beim Bereitstellen aus dem Quellcode wird automatisch ein Container-Image aus dem Quellcode erstellt und bereitgestellt.

So stellen Sie aus der Quelle bereit:

1. Stellen Sie in Ihrem Quellcodeverzeichnis mit dem folgenden Befehl aus der Quelle bereit:

   gcloud run deploy

   Wenn Sie aufgefordert werden, die API zu aktivieren, antworten Sie mit y, um dies zu tun.

   1. Wenn Sie zur Eingabe des Quellcodes aufgefordert werden, drücken Sie die Eingabetaste, um den aktuellen Ordner bereitzustellen.

   2. Wenn Sie zur Eingabe des Dienstnamens aufgefordert werden, drücken Sie die Eingabetaste, um den Standardnamen zu akzeptieren, z. B. helloworld.

   3. Wenn Sie aufgefordert werden, APIs für das Projekt zu aktivieren, z. B. die Artifact Registry API, antworten Sie durch Drücken von y.

   4. Wenn Sie zur Eingabe der Region aufgefordert werden, wählen Sie die Region Ihrer Wahl aus, zum Beispiel us-central1.

   5. Wenn Sie aufgefordert werden, ein Repository in der angegebenen Region zu erstellen, antworten Sie durch Drücken von y.

   6. Wenn Sie aufgefordert werden, nicht authentifizierte Aufrufe zuzulassen, antworten Sie mit y. Diese Eingabeaufforderung wird möglicherweise nicht angezeigt, wenn eine Organisationsrichtlinie zur Domaineinschränkung dies verhindert. Weitere Informationen finden Sie im Abschnitt Vorbereitung.

   Warten Sie dann einige Sekunden, bis die Bereitstellung abgeschlossen ist. Bei Erfolg wird in der Befehlszeile die Dienst-URL angezeigt.

2. Rufen Sie den bereitgestellten Service auf. Dazu öffnen Sie in einem Webbrowser die Dienst-URL.

Cloud Run-Standorte

Cloud Run ist regional. Die Infrastruktur, in der die Cloud Run-Dienste ausgeführt werden, befindet sich demnach in einer bestimmten Region. Aufgrund der Verwaltung durch Google sind die Anwendungen in allen Zonen innerhalb dieser Region redundant verfügbar.

Bei der Auswahl der Region, in der Ihre Cloud Run-Dienste ausgeführt werden, ist vorrangig, dass die Anforderungen hinsichtlich Latenz, Verfügbarkeit oder Langlebigkeit erfüllt werden. Sie können im Allgemeinen die Region auswählen, die Ihren Nutzern am nächsten liegt, aber Sie sollten den Standort der anderen Google Cloud-Produkte berücksichtigen, die von Ihrem Cloud Run-Dienst verwendet werden. Die gemeinsame Nutzung von Google Cloud-Produkten an mehreren Standorten kann sich auf die Latenz und die Kosten des Dienstes auswirken.

Cloud Run ist in diesen Regionen verfügbar:

Unterliegt Preisstufe 1

• asia-east1 (Taiwan)
• asia-northeast1 (Tokio)
• asia-northeast2 (Osaka)
• europe-north1 (Finnland) Niedriger CO₂-Wert
• europe-southwest1 (Madrid) Niedriger CO₂-Ausstoß
• europe-west1 (Belgien) Niedriger CO₂-Ausstoß
• europe-west4 (Niederlande) Niedriger CO₂-Ausstoß
• europe-west8 (Mailand)
• europe-west9 (Paris) Niedriger CO₂-Ausstoß
• me-west1 (Tel Aviv)
• us-central1 (Iowa) Niedriger CO₂-Ausstoß
• us-east1 (South Carolina)
• us-east4 (Northern Virginia)
• us-east5 (Columbus)
• us-south1 (Dallas) Niedriger CO₂-Ausstoß
• us-west1 (Oregon) Niedriger CO₂-Ausstoß

Unterliegt Preisstufe 2

• africa-south1 (Johannesburg)
• asia-east2 (Hongkong)
• asia-northeast3 (Seoul, Südkorea)
• asia-southeast1 (Singapur)
• asia-southeast2 (Jakarta)
• asia-south1 (Mumbai, Indien)
• asia-south2 (Delhi, Indien)
• australia-southeast1 (Sydney)
• australia-southeast2 (Melbourne)
• europe-central2 (Warschau, Polen)
• europe-west10 (Berlin) Niedriger CO₂-Ausstoß
• europe-west12 (Turin)
• europe-west2 (London, Vereinigtes Königreich) Niedriger CO₂-Ausstoß
• europe-west3 (Frankfurt, Deutschland) Niedriger CO₂-Ausstoß
• europe-west6 (Zürich, Schweiz) Niedriger CO₂-Ausstoß
• me-central1 (Doha)
• me-central2 (Dammam)
• northamerica-northeast1 (Montreal) Niedriger CO₂-Ausstoß
• northamerica-northeast2 (Toronto) Niedriger CO₂-Ausstoß
• southamerica-east1 (Sao Paulo, Brasilien) Niedriger CO₂-Ausstoß
• southamerica-west1 (Santiago, Chile) Niedriger CO₂-Ausstoß
• us-west2 (Los Angeles)
• us-west3 (Salt Lake City)
• us-west4 (Las Vegas)

Wenn Sie bereits einen Cloud Run-Dienst erstellt haben, können Sie dessen Region im Cloud Run-Dashboard der Google Cloud Console aufrufen.

OK

Glückwunsch! Sie haben gerade ein Container-Image aus Quellcode in Cloud Run bereitgestellt. Cloud Run skaliert das Container-Image automatisch horizontal aus, damit die empfangenen Anfragen bearbeitet werden können, und skaliert es wieder herunter, wenn der Bedarf sinkt. Es fallen nur Kosten für die CPU-, Arbeitsspeicher- und Netzwerkressourcen an, die während der Anfrageverarbeitung verbraucht werden.

Bereinigen

Testprojekt entfernen

Während für Cloud Run keine Kosten anfallen, wenn der Dienst nicht verwendet wird, wird Ihnen dennoch das Speichern des Container-Images in Artifact Registry möglicherweise in Rechnung gestellt. Sie können das Container-Image löschen oder Ihr Google Cloud-Projekt löschen, um Kosten zu vermeiden. Wenn Sie Ihr Google Cloud-Projekt löschen, wird die Abrechnung für alle in diesem Projekt verwendeten Ressourcen beendet.

Achtung: Das Löschen von Projekten hat folgende Auswirkungen:
• Alle Inhalte des Projekts werden gelöscht. Wenn Sie für die Aufgaben in diesem Dokument ein bereits bestehendes Projekt verwendet haben und dieses löschen, werden auch alle anderen im Rahmen des Projekts erstellten Daten gelöscht.
• Benutzerdefinierte Projekt-IDs gehen verloren. Beim Erstellen dieses Projekts haben Sie möglicherweise eine benutzerdefinierte Projekt-ID erstellt, die Sie weiterhin verwenden möchten. Damit die URLs, die die Projekt-ID nutzen, z. B. eine appspot.com-URL, erhalten bleiben, sollten Sie ausgewählte Ressourcen innerhalb des Projekts löschen, statt das gesamte Projekt.
1. In the Google Cloud console, go to the Manage resources page.

   Go to Manage resources

2. In the project list, select the project that you want to delete, and then click Delete.
3. In the dialog, type the project ID, and then click Shut down to delete the project.

Nächste Schritte

Weitere Informationen dazu, wie Sie einen Container aus Quellcode erstellen und diesen mithilfe eines Push-Vorgangs in ein Repository übertragen, finden Sie unter:

• Cloud Run-Dienste entwickeln
• Container erstellen
• Aus Quellcode bereitstellen

Für eine automatische GitHub-Integration und optimierte Bereitstellungen mit CDN für Server-gerenderte Angular-Apps sollten Sie die Verwendung von Firebase App Hosting erwägen.