> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify-mintlify-add-letter-a-quickstart-82277.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# AWS Route 53 et CloudFront

> Héberger la documentation sur un sous-chemin personnalisé avec les services AWS

Pour héberger votre documentation sous un sous-chemin personnalisé tel que `yoursite.com/docs` avec AWS Route 53 et CloudFront, vous devez configurer votre fournisseur DNS pour qu’il pointe vers votre distribution CloudFront.

<div id="repository-structure">
  ## Structure du référentiel
</div>

Vos fichiers de documentation doivent être organisés dans votre référentiel pour correspondre à la structure de sous-chemin que vous avez choisie. Par exemple, si vous souhaitez que votre documentation soit accessible à l’adresse `yoursite.com/docs`, créez un répertoire `docs/` contenant tous vos fichiers de documentation.

<div id="high-level-overview">
  ## Vue d’ensemble
</div>

Redirigez le trafic vers ces chemins avec une stratégie de cache **CachingDisabled** :

* `/.well-known/acme-challenge/*` - Requis pour la vérification de certificat Let's Encrypt
* `/.well-known/vercel/*` - Requis pour la vérification du domain
* `/docs/*` - Requis pour l’acheminement par sous-chemin
* `/docs/` - Requis pour l’acheminement par sous-chemin

Redirigez le trafic vers ce chemin avec une stratégie de cache **CachingEnabled** :

* `/mintlify-assets/_next/static/*`
* `Default (*)` - Page d’accueil de votre site

Tous les comportements doivent utiliser une **origin request policy** `AllViewerExceptHostHeader`.

<img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/all-behaviors.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=00132cc77e9e2ef9ad4de8c543342e50" alt="Page CloudFront « Behaviors » avec 4 comportements : /docs/*, /docs, Default, et /.well-known/*." width="1603" height="365" data-path="images/cloudfront/all-behaviors.png" />

<div id="create-cloudfront-distribution">
  ## Créer une distribution CloudFront
</div>

1. Accédez à [CloudFront](https://aws.amazon.com/cloudfront) dans la console AWS.
2. Cliquez sur **Create distribution**.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/create-distribution.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=5bbe8809b8dc6943309a993c09464ace" alt="Page des distributions CloudFront avec le bouton « Create distribution » mis en évidence." width="3024" height="922" data-path="images/cloudfront/create-distribution.png" />
</Frame>

3. Pour Origin domain, saisissez `[SUBDOMAIN].mintlify.dev`, où `[SUBDOMAIN]` est le sous-domaine unique de votre projet.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/origin-name.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=fd37b7b367833ac51b14319368721af3" alt="Page « Create distribution » de CloudFront affichant « acme.mintlify.dev » comme domaine d’origine." width="1495" height="1036" data-path="images/cloudfront/origin-name.png" />
</Frame>

4. Pour Web Application Firewall (WAF), activez les protections de sécurité.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/enable-security-protections.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=e2afcfc99a9fb01b47b26f54e2d8addc" alt="Options Web Application Firewall (WAF) avec « Enable security protections » sélectionné." width="1482" height="877" data-path="images/cloudfront/enable-security-protections.png" />
</Frame>

5. Laissez les autres paramètres par défaut.
6. Cliquez sur **Create distribution**.

<div id="add-default-origin">
  ## Ajouter l’origine par défaut
</div>

1. Après avoir créé la distribution, accédez à l’onglet « Origins ».

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/origins.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=f5b6024ae22aec917a20c579c94d5e1f" alt="Une distribution CloudFront avec l’onglet « Origins » mis en évidence." width="3024" height="1466" data-path="images/cloudfront/origins.png" />
</Frame>

2. Recherchez votre URL de préproduction qui reflète le domaine principal. Cela varie fortement selon la façon dont votre landing page est hébergée. Par exemple, l’URL de préproduction de Mintlify est [mintlify-landing-page.vercel.app](https://mintlify-landing-page.vercel.app).

<Info>
  Si votre landing page est hébergée sur Webflow, utilisez l’URL de préproduction de Webflow. Elle se termine par `.webflow.io`.

  Si vous utilisez Vercel, utilisez le domain `.vercel.app` disponible pour chaque projet.
</Info>

3. Créez une nouvelle Origin et ajoutez votre URL de préproduction comme « Origin domain ».

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/default-origin.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=13a715dac0b866ef594fb32fe8e3079f" alt="Page CloudFront « Create origin » avec le champ de saisie « Origin domain » mis en évidence." width="3024" height="1332" data-path="images/cloudfront/default-origin.png" />
</Frame>

À ce stade, vous devriez avoir deux Origins : une avec `[SUBDOMAIN].mintlify.app` et une autre avec votre URL de préproduction.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/final-origins.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=ae22afe1dbd570f6e1fc21e076332ab2" alt="Page CloudFront « Origins » avec deux origins : l’une pour mintlify et l’autre pour mintlify-landing-page." width="1230" height="690" data-path="images/cloudfront/final-origins.png" />
</Frame>

<div id="set-behaviors">
  ## Configurer les comportements
</div>

Les comportements dans CloudFront permettent de contrôler la logique des sous-chemins. Globalement, nous voulons mettre en place la logique suivante :

* **Si un utilisateur arrive sur votre sous-chemin personnalisé**, rediriger vers `[SUBDOMAIN].mintlify.dev`.
* **Si un utilisateur arrive sur une autre page**, rediriger vers la page d’atterrissage actuelle.

1. Accédez à l’onglet « Behaviors » de votre distribution CloudFront.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/behaviors.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=d3eb228d572818e575edd84f3189c5a7" alt="Onglet « Behaviors » de CloudFront mis en évidence." width="3024" height="1384" data-path="images/cloudfront/behaviors.png" />
</Frame>

2. Sélectionnez le bouton **Create behavior** et créez les comportements suivants.

<div id="well-known">
  ### `/.well-known/*`
</div>

Créez des comportements pour les chemins de vérification de domaine Vercel avec un **Path pattern** `/.well-known/*` et définissez **Origin and origin groups** sur l’URL de votre documentation.

Pour « Cache policy », sélectionnez **CachingDisabled** afin de garantir que ces requêtes de vérification passent sans mise en cache.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/well-known-policy.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=59adb322bc8f725f1f8286c66618f0ca" alt="Page CloudFront « Create behavior » avec un « Path pattern » de « /.well-known/* » et « Origin and origin groups » pointant vers l’URL d’environnement de staging." width="1413" height="1098" data-path="images/cloudfront/well-known-policy.png" />
</Frame>

<Info>
  Si `/.well-known/*` est trop générique, vous pouvez le restreindre à au moins deux comportements pour Vercel :

  * `/.well-known/vercel/*` — requis pour la vérification de domaine Vercel
  * `/.well-known/acme-challenge/*` — requis pour la vérification de certificat Let's Encrypt
</Info>

<div id="your-custom-subpath">
  ### Votre sous-chemin personnalisé
</div>

Créez un comportement avec un **motif de chemin** correspondant au sous-chemin de votre choix, par exemple `/docs`, avec **Origin and origin groups** pointant vers l’URL `.mintlify.dev` (dans notre cas `acme.mintlify.dev`).

* Définissez « Cache policy » sur **CachingOptimized**.
* Définissez « Origin request policy » sur **AllViewerExceptHostHeader**.
* Définissez « Viewer Protocol Policy » sur **Redirect HTTP to HTTPS**.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/behavior-1.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=bbeb7987931feb9c975714fdc97caa1f" alt="Page CloudFront « Create behavior » avec un « Path pattern » de « /docs/* » et « Origin and origin groups » pointant vers l’URL acme.mintlify.dev." width="1520" height="1117" data-path="images/cloudfront/behavior-1.png" />
</Frame>

<div id="your-custom-subpath-with-wildcard">
  ### Votre sous-chemin personnalisé avec caractère générique
</div>

Créez un comportement avec un **Path pattern** correspondant au sous-chemin de votre choix suivi de `/*`, par exemple `/docs/*`, et des **Origin and origin groups** pointant vers la même URL `.mintlify.dev`.

Ces paramètres doivent correspondre exactement au comportement de votre sous-chemin de base, à l’exception du **Path pattern**.

* Définissez « Cache policy » sur **CachingOptimized**.
* Définissez « Origin request policy » sur **AllViewerExceptHostHeader**.
* Définissez « Viewer protocol policy » sur **Redirect HTTP to HTTPS**.

<div id="mintlify-assets_nextstatic">
  ### `/mintlify-assets/_next/static/*`
</div>

* Définissez la "Cache policy" sur **CachingOptimized**
* Définissez la "Origin request policy" sur **AllViewerExceptHostHeader**
* Définissez la "Viewer protocol policy" sur **Redirect HTTP to HTTPS**

<div id="default">
  ### `Default (*)`
</div>

Enfin, nous allons modifier le comportement `Default (*)`.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/default-behavior-1.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=44913014b1f08d6d7787d4299740a7e8" alt="Une distribution CloudFront avec le comportement « Default (*) » sélectionné et le bouton Edit mis en évidence." width="3024" height="1406" data-path="images/cloudfront/default-behavior-1.png" />
</Frame>

1. Modifiez le paramètre **Origin and origin groups** du comportement par défaut pour utiliser l’URL de préproduction (dans notre cas `mintlify-landing-page.vercel.app`).

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/default-behavior-2.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=9bc104a286e19cb51016d12f356bf976" alt="Page CloudFront « Edit behavior » avec le champ de saisie « Origin and origin groups » mis en surbrillance." width="3024" height="1298" data-path="images/cloudfront/default-behavior-2.png" />
</Frame>

2. Sélectionnez **Enregistrer les modifications**.

<div id="check-behaviors-are-set-up-correctly">
  ### Vérifiez que les comportements sont correctement configurés
</div>

Si vous avez suivi les étapes ci-dessus, vos comportements devraient ressembler à ceci :

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/all-behaviors.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=00132cc77e9e2ef9ad4de8c543342e50" alt="Page « Behaviors » de CloudFront avec 4 comportements : /docs/*, /docs, Default et /.well-known/*." width="1603" height="365" data-path="images/cloudfront/all-behaviors.png" />
</Frame>

<div id="preview-distribution">
  ## Prévisualiser la distribution
</div>

Vous pouvez maintenant vérifier si votre distribution est correctement configurée en allant dans l’onglet « General » et en ouvrant l’URL **Distribution domain name**.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/preview-distribution.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=37008340d0b430f400c28e174429f674" alt="Onglet CloudFront « General » avec l’URL « Distribution domain name » mise en évidence." width="3024" height="1394" data-path="images/cloudfront/preview-distribution.png" />
</Frame>

Toutes les pages devraient pointer vers votre page d’accueil principale. En revanche, si vous ajoutez le sous-chemin que vous avez choisi, par exemple `/docs`, à l’URL, vous devriez être redirigé vers votre instance de documentation Mintlify.

<div id="connect-with-route53">
  ## Connecter Route53
</div>

Nous allons maintenant connecter la distribution CloudFront à votre domaine principal.

<Note>
  Pour cette section, vous pouvez également consulter le guide officiel d’AWS : [Configurer
  Amazon Route 53 pour acheminer le trafic vers une distribution
  CloudFront](https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/routing-to-cloudfront-distribution.html#routing-to-cloudfront-distribution-config)
</Note>

1. Ouvrez [Route53](https://aws.amazon.com/route53) dans la console AWS.
2. Accédez à la « Hosted zone » de votre domaine principal.
3. Sélectionnez **Create record**.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/route53-create-record.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=6d4fefdbe42c04aecbde312c713e16f7" alt="Page « Records » de Route 53 avec le bouton « Create record » mis en évidence." width="1540" height="1238" data-path="images/cloudfront/route53-create-record.png" />
</Frame>

4. Activez `Alias`, puis, pour **Route traffic to**, choisissez l’option `Alias to CloudFront distribution`.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-letter-a-quickstart-82277/ghbOMB_NFAQYiUUs/images/cloudfront/create-record-alias.png?fit=max&auto=format&n=ghbOMB_NFAQYiUUs&q=85&s=6d5c848c92b55968991fa333948c2533" alt="Page « Create record » de Route 53 avec l’option « Alias » activée et le menu « Route traffic to » mis en évidence." width="3024" height="1494" data-path="images/cloudfront/create-record-alias.png" />
</Frame>

5. Sélectionnez **Create records**.

<Note>
  Vous devrez peut-être supprimer l’enregistrement A existant s’il y en a un.
</Note>

Votre documentation est maintenant accessible au sous-chemin choisi de votre domaine principal.

<Note>
  Après avoir configuré votre DNS, les sous-domaines personnalisés sont généralement disponibles en quelques minutes. La propagation DNS peut parfois prendre 1 à 4 heures, et dans de rares cas jusqu’à 48 heures. Si votre sous-domaine n’est pas immédiatement disponible, veuillez patienter avant d’entreprendre tout dépannage.
</Note>
