Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

# SSR-Funktionalität zu einer statischen Next.js App hinzufügen
<a name="redeploy-ssg-to-ssr"></a>

Sie können SSR-Funktionalität zu einer vorhandenen statischen (SSG) Next.js App hinzufügen, die mit Amplify bereitgestellt wird. Bevor Sie mit der Konvertierung Ihrer SSG-App in SSR beginnen, aktualisieren Sie die App so, dass sie Next.js Version 12 oder höher verwendet, und fügen Sie SSR-Funktionen hinzu. Dann müssen Sie die folgenden Schritte ausführen.

1. Verwenden Sie die AWS Command Line Interface , um den Plattformtyp der App zu ändern.

1. Fügen Sie der App eine Servicerolle hinzu.

1. Aktualisieren Sie das Ausgabeverzeichnis in den Build-Einstellungen der App.

1. Aktualisieren Sie die `package.json` Datei der App, um anzugeben, dass die App SSR verwendet.

## Aktualisierung der Plattform
<a name="update-platform"></a>

Es gibt drei gültige Werte für den Plattformtyp. Eine SSG-App ist auf den Plattformtyp `WEB` eingestellt. Eine SSR-App, die Next.js Version 11 verwendet, ist auf den Plattformtyp eingestellt. `WEB_DYNAMIC` Für Apps, die auf Next.js 12 oder höher mithilfe von SSR bereitgestellt werden, das von Amplify Hosting Compute verwaltet wird, ist der Plattformtyp auf eingestellt. `WEB_COMPUTE`

Wenn Sie Ihre App als SSG-App bereitgestellt haben, hat Amplify den Plattformtyp auf gesetzt. `WEB` Verwenden Sie die AWS CLI , um die Plattform für Ihre App zu ändern. `WEB_COMPUTE` Öffnen Sie ein Terminalfenster und geben Sie den folgenden Befehl ein. Aktualisieren Sie dabei den roten Text mit Ihrer eindeutigen App-ID und Region.

```
aws amplify update-app --app-id {{abcd1234}} --platform WEB_COMPUTE --region {{us-west-2}}
```

## Eine Servicerolle hinzufügen
<a name="add-service-role"></a>

Eine Servicerolle ist die AWS Identity and Access Management (IAM) -Rolle, die Amplify übernimmt, wenn es in Ihrem Namen andere Dienste anruft. Folgen Sie diesen Schritten, um einer SSG-App, die bereits mit Amplify bereitgestellt wurde, eine Servicerolle hinzuzufügen.

**Um eine Servicerolle hinzuzufügen**

1. Melden Sie sich bei der an AWS-Managementkonsole und öffnen Sie die [Amplify-Konsole](https://console.aws.amazon.com/amplify/).

1. Wenn Sie in Ihrem Amplify-Konto noch keine Servicerolle erstellt haben, finden Sie Informationen unter [Hinzufügen einer Servicerolle](amplify-service-role.md), um diesen vorausgesetzten Schritt abzuschließen.

1. Wählen Sie die statische App Next.js aus, zu der Sie eine Servicerolle hinzufügen möchten.

1. Wählen Sie im Navigationsbereich **App-Einstellungen**, **Allgemein** aus.

1. Wählen Sie auf der Seite mit den **App-Details** die Option **Bearbeiten**

1. Wählen Sie **unter Servicerolle** den Namen einer vorhandenen Servicerolle oder den Namen der Servicerolle, die Sie in Schritt 2 erstellt haben.

1. Wählen Sie **Speichern**.

## Aktualisierung der Build-Einstellungen
<a name="update-build-settings"></a>

Bevor Sie Ihre App erneut mit SSR-Funktionalität bereitstellen, müssen Sie die Build-Einstellungen für die App aktualisieren, um das Ausgabeverzeichnis auf festzulegen. `.next` Sie können die Build-Einstellungen in der Amplify-Konsole oder in einer in Ihrem Repo gespeicherten `amplify.yml` Datei bearbeiten. Weitere Informationen finden Sie unter [Konfiguration der Build-Einstellungen für eine Amplify-Anwendung](build-settings.md).

Das Folgende ist ein Beispiel für die Build-Einstellungen für eine App, bei der auf eingestellt `baseDirectory` ist. `.next`

```
version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*
```

## Die Datei package.json wird aktualisiert
<a name="update-package.json-file"></a>

Nachdem Sie eine Servicerolle hinzugefügt und die Build-Einstellungen aktualisiert haben, aktualisieren Sie die Datei der App. `package.json` Stellen Sie wie im folgenden Beispiel das Build-Skript so ein, dass `"next build"` es angibt, dass die App Next.js sowohl SSG- als auch SSR-Seiten unterstützt.

```
"scripts": {
  "dev": "next dev",
  "build": "next build",
  "start": "next start"
},
```

Amplify erkennt die Änderung an der `package.json` Datei in Ihrem Repo und stellt die App mit SSR-Funktionalität erneut bereit.