Amplify le support pour les frameworks SSR - AWS Amplify Hébergement

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Amplify le support pour les frameworks SSR

Amplify Hosting prend en charge tout framework SSR JavaScript basé sur un bundle de déploiement conforme à la sortie de compilation attendue par Amplify. Amplify Hosting fournit une spécification de déploiement qui normalise les fichiers et la structure de répertoires pour la sortie de la version d'une application pour tout framework SSR.

Les auteurs de frameworks peuvent utiliser la spécification de déploiement basée sur le système de fichiers pour développer des adaptateurs de build open source personnalisés pour leurs frameworks spécifiques. Ces adaptateurs transformeront la sortie de compilation d'une application en un bundle de déploiement conforme à la structure de répertoire attendue d'Amplify Hosting. Ce bundle de déploiement inclura tous les fichiers et actifs nécessaires pour héberger une application, y compris la configuration d'exécution, telle que les règles de routage.

Si vous n'utilisez pas de framework ou d'adaptateur de framework, vous pouvez développer votre propre solution pour générer un bundle de déploiement conforme à la structure de répertoire attendue d'Amplify Hosting.

Amplify Hosting prend en charge les types primitifs suivants : actifs statiques, calcul, optimisation des images et règles de routage. Vous pouvez tirer parti de ces types primitifs pour déployer des applications dotées de fonctionnalités plus riches. Pour des informations détaillées sur chaque type primitif, consultezAmplify SSR : prise en charge du type primitif.

Vous pouvez choisir parmi les scénarios suivants pour commencer à déployer une application SSR sur Amplify.

Déployer une application Next.js

Amplify prend en charge les applications créées à l'aide de Next.js sans avoir besoin d'un adaptateur ou d'une configuration manuelle dans la console. Pour plus d’informations, consultez Amplify le support pour Next.js.

Déployer une application qui utilise un adaptateur de framework

Vous pouvez référencer n'importe quel adaptateur de framework open source disponible pour déployer votre application SSR sur Amplify Hosting. Pour plus d’informations, consultez Utilisation d'un adaptateur de framework.

Un adaptateur est disponible pour le framework Nuxt. Pour plus d'informations sur l'utilisation de cet adaptateur, consultez la documentation Nuxt.

Création d'un adaptateur de framework

Les auteurs de frameworks qui souhaitent intégrer les fonctionnalités fournies par un framework peuvent utiliser la spécification de déploiement d'Amplify Hosting pour configurer la sortie de votre build afin qu'elle soit conforme à la structure attendue par Amplify. Pour plus d’informations, consultez Déploiement d'un serveur Express à l'aide du manifeste de déploiement.

Configuration d'un script de post-construction

Vous pouvez utiliser la spécification de déploiement d'Amplify Hosting pour manipuler la sortie de votre build selon les besoins de scénarios spécifiques. Pour plus d’informations, consultez Utilisation de la spécification de déploiement d'Amplify Hosting pour configurer la sortie de compilation. Pour obtenir un exemple, consultez Déploiement d'un serveur Express à l'aide du manifeste de déploiement.

Déployer une application SSR sur Amplify

Vous pouvez utiliser les instructions de cette rubrique pour déployer une application créée avec n'importe quel framework avec un bundle de déploiement conforme à la sortie de compilation attendue par Amplify. Si vous déployez une application Next.js, aucun adaptateur n'est nécessaire.

Si vous déployez une application SSR qui utilise un adaptateur framework, vous devez d'abord installer et configurer l'adaptateur. Pour obtenir des instructions, veuillez consulter Utilisation d'un adaptateur de framework.

Pour déployer une application SSR sur Amplify Hosting
  1. Connectez-vous à la console Amplify AWS Management Console et ouvrez-la.

  2. Sur la page Toutes les applications, choisissez Créer une nouvelle application.

  3. Sur la page Commencer à créer avec Amplify, choisissez votre fournisseur de dépôt Git, puis choisissez Next.

  4. Sur la page Ajouter une branche de référentiel, procédez comme suit :

    1. Sélectionnez le nom du référentiel à connecter.

    2. Sélectionnez le nom de la branche du référentiel à connecter.

    3. Choisissez Suivant.

  5. Sur la page des paramètres de l'application, Amplify détecte automatiquement les applications Next.js SSR.

    Si vous déployez une application SSR qui utilise un adaptateur pour un autre framework, vous devez activer Amazon CloudWatch Logs de manière explicite. Ouvrez la section Paramètres avancés, puis choisissez Activer les journaux d'applications SSR dans la section Déploiement du rendu côté serveur (SSR).

  6. L'application nécessite un rôle de service IAM qu'Amplify suppose de vous fournir des journaux. Compte AWS

    La procédure d'ajout d'un rôle de service varie selon que vous souhaitez créer un nouveau rôle ou utiliser un rôle existant.

    • Pour créer un nouveau rôle :

      1. Choisissez Créer et utilisez un nouveau rôle de service.

    • Pour utiliser un rôle existant :

      1. Choisissez Utiliser un rôle existant.

      2. Dans la liste des rôles de service, sélectionnez le rôle à utiliser.

  7. Choisissez Suivant.

  8. Sur la page Révision, choisissez Enregistrer et déployer.

Utilisation d'un adaptateur de framework

Vous pouvez installer et utiliser n'importe quel adaptateur de construction de framework SSR créé pour être intégré à Amplify Hosting. Chaque infrastructure qui propose un adaptateur détermine la manière dont l'adaptateur est configuré et connecté à son processus de création. En règle générale, vous installerez l'adaptateur en tant que dépendance de développement npm.

Après avoir créé une application avec un framework, consultez la documentation du framework pour savoir comment installer l'adaptateur Amplify Hosting et le configurer dans le fichier de configuration de votre application.

Créez ensuite un amplify.yml fichier dans le répertoire racine de votre projet. Dans le amplify.yml fichier, définissez le répertoire baseDirectory de sortie de compilation de votre application. Le framework exécute l'adaptateur pendant le processus de génération pour transformer la sortie en bundle de déploiement Amplify Hosting.

Le nom du répertoire de sortie de compilation peut être n'importe quoi, mais le .amplify-hosting nom du fichier a une importance. Amplify recherche d'abord un répertoire défini comme. baseDirectory S'il existe, Amplify y recherche la sortie de compilation. Si le répertoire n'existe pas, Amplify recherche la sortie de compilation qu'il contient.amplify-hosting, même si elle n'a pas été définie par le client.

Voici un exemple des paramètres de génération d'une application. Le baseDirectory est défini sur .amplify-hosting pour indiquer que la sortie de compilation se trouve dans le .amplify-hosting dossier. Tant que le contenu du .amplify-hosting dossier correspond aux spécifications de déploiement d'Amplify Hosting, l'application sera déployée avec succès.

version: 1 frontend: preBuild: commands: - npm install build: commands: - npm run build artifacts: baseDirectory: .amplify-hosting

Une fois que votre application est configurée pour utiliser un adaptateur de framework, vous pouvez la déployer sur Amplify Hosting. Pour obtenir les instructions complètes, consultez Déployer une application SSR sur Amplify.