> ## Documentation Index
> Fetch the complete documentation index at: https://omer-914cc1c6.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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/all-behaviors.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=e28ca7f1a2e94eeb8eed62f6ae5c1d53" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/create-distribution.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=b5b53c3c979475c73f2e0de9ec67e745" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/origin-name.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=d42ce75a7d38718d48e03d60a07b7d43" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/enable-security-protections.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=ab3cb2f88e7105cf5dc046054559690d" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/origins.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=930736017fe33d5aeaa65d17ff209dcf" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/default-origin.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=4b496468140f03fd98b743180e716f7e" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/final-origins.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=0ffc5d54eb6f3a0a936b6e8e46870326" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/behaviors.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=d561cd9f02eceb65818f32b992cb5f9d" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/well-known-policy.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=88d29c97195304dc17352a3586e29595" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/behavior-1.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=01f57f8be88850eb1f2919b319d8851e" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/default-behavior-1.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=d1028ea337a4f8fbda88086ed80edabb" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/default-behavior-2.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=d363a70a1e99f274a3aca8f47fb2f909" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/all-behaviors.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=e28ca7f1a2e94eeb8eed62f6ae5c1d53" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/preview-distribution.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=ac51d2fb595da7c4321df07b75ea91c2" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/route53-create-record.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=42fa1ebe5bde68138c9a5a5e6ef536e5" 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/omer-914cc1c6/AiL60EGGBeap42Y0/images/cloudfront/create-record-alias.png?fit=max&auto=format&n=AiL60EGGBeap42Y0&q=85&s=7aeda5e74a5feca3e34da2b72cde532f" 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>
