

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.

# Connexion gérée par le groupe d'utilisateurs
<a name="cognito-user-pools-managed-login"></a>

Vous pouvez choisir un domaine Web pour héberger les services destinés à votre groupe d'utilisateurs. Un groupe d'utilisateurs Amazon Cognito bénéficie des fonctions suivantes lorsque vous ajoutez un domaine, ce que l'on appelle collectivement connexion *gérée*.
+ Un [serveur d'autorisation](https://datatracker.ietf.org/doc/html/rfc6749#section-1.1) qui agit en tant que fournisseur d'identité (IdP) pour les applications qui fonctionnent avec la OAuth version 2.0 et OpenID Connect (OIDC). Le serveur d'autorisation [achemine les demandes](authorization-endpoint.md), [émet et gère les jetons Web JSON (JWTs)](token-endpoint.md) et [fournit des informations sur les attributs utilisateur](userinfo-endpoint.md).
+ Une interface ready-to-use utilisateur (UI) pour les opérations d'authentification telles que la connexion, la déconnexion et la gestion des mots de passe. Les *pages de connexion gérées* agissent comme une interface Web pour les services d'authentification.
+ Un fournisseur de services (SP) ou une partie utilisatrice (RP) de SAML 2.0 IdPs, OIDC IdPs, Facebook, Login with Amazon, Sign in with Apple et Google.

L'*interface utilisateur hébergée* classique est une option supplémentaire qui partage certaines fonctionnalités avec la connexion gérée. L'interface utilisateur hébergée classique est une version de première génération des services de connexion gérés. Les services IdP et RP de l'interface utilisateur hébergée présentent généralement les mêmes caractéristiques que la connexion gérée, mais les pages de connexion ont une conception plus simple et moins de fonctionnalités. Par exemple, la connexion par clé d'accès n'est pas disponible dans l'interface utilisateur hébergée classique. Dans le [plan de fonctionnalités](cognito-sign-in-feature-plans.md) Lite, l'interface utilisateur hébergée classique est votre seule option pour les services de domaine du pool d'utilisateurs.

Les pages de connexion gérées sont un ensemble d'interfaces Web pour les activités de base d'inscription, de connexion, d'authentification multifactorielle et de réinitialisation du mot de passe dans votre groupe d'utilisateurs. Ils connectent également les utilisateurs à un ou plusieurs fournisseurs d'identité tiers (IdPs) lorsque vous souhaitez leur donner le choix d'une option de connexion. Votre application peut appeler vos pages de connexion gérées dans les navigateurs des utilisateurs lorsque vous souhaitez authentifier et autoriser les utilisateurs.

Vous pouvez adapter l'expérience utilisateur à connexion gérée à votre marque grâce à des logos, des arrière-plans et des styles personnalisés. Deux options s'offrent à vous quant à l'image de marque que vous pouvez appliquer à votre interface utilisateur de connexion gérée : l'*éditeur de marque* pour la connexion gérée et la *marque de l'interface utilisateur hébergée (classique)* pour l'interface utilisateur hébergée.

**Éditeur de marque**  
Une expérience utilisateur actualisée avec le plus grand nombre up-to-date d'options d'authentification et un éditeur visuel dans la console Amazon Cognito.

**Identité de marque de l'interface**  
Une expérience utilisateur familière aux anciens utilisateurs d'Amazon Cognito. L'image de marque de l'interface utilisateur hébergée est un système basé sur des fichiers. Pour appliquer une image de marque aux pages d'interface utilisateur hébergées, vous téléchargez un fichier image de logo et un fichier qui définit les valeurs de plusieurs options de style CSS prédéterminées.

L'éditeur de marque n'est pas disponible dans tous les plans de fonctionnalités destinés aux groupes d'utilisateurs. Pour de plus amples informations, veuillez consulter [Plans de fonctionnalités du pool d'utilisateurs](cognito-sign-in-feature-plans.md).

Pour plus d'informations sur la création de demandes destinées à des services de connexion gérés et d'interface utilisateur hébergés, consultez[Points de terminaison du groupe d'utilisateurs et référence de connexion gérée](cognito-userpools-server-contract-reference.md).

**Note**  
La connexion gérée par Amazon Cognito ne prend pas en charge l'authentification personnalisée avec des déclencheurs [Lambda de défi d'authentification personnalisés](user-pool-lambda-challenge.md).

**Topics**
+ [Localisation des connexions gérées](#managed-login-localization)
+ [Documents relatifs aux conditions](#managed-login-terms-documents)
+ [Configuration de la connexion gérée avec AWS Amplify](#cognito-user-pools-app-integration-amplify)
+ [Configuration de la connexion gérée avec la console Amazon Cognito](#set-up-managed-login)
+ [Affichage de votre page de connexion](#view-login-pages)
+ [Personnalisation de vos pages d'authentification](#cognito-user-pools-app-integration-customize-hosted-ui)
+ [Ce qu'il faut savoir sur la connexion gérée et l'interface utilisateur hébergée](#managed-login-things-to-know)
+ [Configuration d'un domaine de groupe d'utilisateurs](cognito-user-pools-assign-domain.md)
+ [Appliquer une image de marque aux pages de connexion gérées](managed-login-branding.md)

## Localisation des connexions gérées
<a name="managed-login-localization"></a>

La connexion gérée utilise par défaut la langue anglaise dans les pages interactives avec l'utilisateur. Vous pouvez afficher vos pages de connexion gérées localisées dans la langue de votre choix. Les langues disponibles sont celles disponibles dans le AWS Management Console. Dans le lien que vous distribuez aux utilisateurs, ajoutez un paramètre de `lang` requête, comme illustré dans l'exemple suivant.

```
https://<your domain>/oauth2/authorize?lang=es&response_type=code&client_id=<your app client id>&redirect_uri=<your relying-party url>
```

Amazon Cognito place un cookie dans le navigateur des utilisateurs avec leur préférence de langue après la demande initiale avec un `lang` paramètre. Une fois le cookie défini, le choix de langue est maintenu sans que le paramètre ne soit affiché ou que vous n'ayez à inclure le paramètre dans les demandes. Par exemple, une fois qu'un utilisateur a fait une demande de connexion avec un `lang=de` paramètre, ses pages de connexion gérées s'affichent en allemand jusqu'à ce qu'il efface ses cookies ou fasse une nouvelle demande avec un nouveau paramètre de localisation tel que`lang=en`.

La localisation n'est disponible que pour les connexions gérées. Vous devez souscrire au [plan de fonctionnalités](cognito-sign-in-feature-plans.md) Essentials ou Plus et avoir attribué à votre domaine l'utilisation de la [marque de connexion gérée](managed-login-branding.md).

La sélection effectuée par votre utilisateur dans le cadre de la connexion gérée n'est pas disponible pour les [déclencheurs d'envoi d'e-mails ou de SMS personnalisés](user-pool-lambda-custom-sender-triggers.md). Lorsque vous implémentez ces déclencheurs, vous devez utiliser d'autres mécanismes pour déterminer la langue préférée de l'utilisateur. Dans les flux de connexion, l'`locale`attribut peut indiquer la langue préférée de l'utilisateur en fonction de son emplacement. Dans les flux d'inscription, la région ou l'ID client de l'application de votre groupe d'utilisateurs peut indiquer une préférence linguistique.

Les langues suivantes sont disponibles.


**Langues de connexion gérées**  

| Language | Code | 
| --- | --- | 
| Allemand | de | 
| Anglais | en | 
| Espagnol | es | 
| Français | fr | 
| Bahasa Indonésie | id | 
| Italien | it | 
| Japonais | ja | 
| Coréen | ko | 
| Portugais (Brésil) | pt-BR | 
| Chinois (simplifié) | zh-CN | 
| Chinois (Traditionnel) | zh-TW | 

## Documents relatifs aux conditions
<a name="managed-login-terms-documents"></a>

Vous pouvez configurer vos pages de connexion gérées pour afficher des liens vers vos documents relatifs aux **conditions d'utilisation** et à **la politique de confidentialité** lorsque les utilisateurs s'inscrivent. Lorsque vous configurez les deux documents de conditions dans le client de votre application, les utilisateurs voient le texte suivant lors de l'inscription : **En vous inscrivant, vous acceptez nos conditions d'utilisation et notre politique de confidentialité**. Les expressions « **Conditions d'utilisation** » et « **Politique de confidentialité** » apparaissent sur votre page de connexion gérée, avec un lien hypertexte vers vos documents.

Les documents de conditions prennent en charge des langues spécifiques URLs qui correspondent à la localisation des connexions gérées. Lorsque les utilisateurs sélectionnent une langue avec le paramètre de `lang` requête, Amazon Cognito affiche des liens vers vos documents de termes dans cette langue. Si vous n'avez pas configuré d'URL pour une langue spécifique, Amazon Cognito utilise l'URL par défaut que vous avez configurée pour le client de l'application.

Pour configurer les documents de conditions pour votre client d'application, accédez au menu **Connexion gérée** dans votre groupe d'utilisateurs. Sous **Documents de conditions**, choisissez **Créer un document de conditions**.

------
#### [ Amazon Cognito console ]

**Pour créer un document de conditions**

1. Accédez à votre groupe d'utilisateurs et choisissez le menu **Connexion gérée**. Localisez **les documents relatifs aux conditions**.

1. Choisissez **Créer un document de conditions**.

1. Sélectionnez le client d'application auquel vous souhaitez attribuer le document de conditions.

1. Entrez le **nom des termes**. Cela identifie votre document dans la console.

1. Sous **Liens**, choisissez une **langue** et entrez l'**URL** où vous hébergez votre document de conditions dans cette langue.

1.  URLs Pour ajouter des langues supplémentaires, choisissez **Ajouter une autre**.

1. Choisissez **Créer**.

------
#### [ Amazon Cognito user pools API ]

Voici un exemple de corps de [CreateTerms](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateTerms.html)demande. Cela fait en sorte que la page d'inscription du client `1example23456789` de l'application affiche des liens vers une version en français et une version en portugais (Brésil) de la politique de confidentialité lorsque la connexion gérée est localisée dans cette langue. Une demande distincte doit être définie `terms-of-use` avant que URLs la connexion gérée affiche les liens sur la page d'inscription.

```
{
   "ClientId": "1example23456789",
   "Enforcement": "NONE",
   "Links": { 
      "cognito:default" : "https://example.com/privacy/",
      "cognito:french" : "https://example.com/fr/privacy/",
      "cognito:portuguese-brazil" : "https://example.com/pt/privacy/"
   },
   "TermsName": "privacy-policy",
   "TermsSource": "LINK",
   "UserPoolId": "us-east-1_EXAMPLE"
}
```

------

**Note**  
Vous devez créer à la fois des conditions d'utilisation et un document de politique de confidentialité pour votre client d'application avant qu'Amazon Cognito n'affiche les documents relatifs aux termes sur vos pages de connexion gérées.

## Configuration de la connexion gérée avec AWS Amplify
<a name="cognito-user-pools-app-integration-amplify"></a>

Si vous ajoutez l'authentification AWS Amplify à votre application Web ou mobile, vous pouvez configurer vos pages de connexion gérées dans l'interface de ligne de commande (CLI) Amplify et les bibliothèques dans le framework Amplify. Pour ajouter l'authentification à votre application, ajoutez la `Auth` catégorie à votre projet. Ensuite, dans votre application, authentifiez les utilisateurs du groupe d'utilisateurs avec les bibliothèques clientes Amplify.

Vous pouvez appeler des pages de connexion gérées pour l'authentification ou vous pouvez fédérer des utilisateurs via un point de terminaison d'autorisation qui redirige vers un IdP. Une fois qu'un utilisateur s'est authentifié avec succès auprès du fournisseur, Amplify crée un nouvel utilisateur dans votre groupe d'utilisateurs et transmet les jetons de l'utilisateur à votre application.

Les exemples suivants montrent comment AWS Amplify configurer la connexion gérée avec les fournisseurs sociaux dans votre application.
+ [React](https://docs.amplify.aws/react/build-a-backend/auth/concepts/external-identity-providers/)
+ [Swift](https://docs.amplify.aws/swift/build-a-backend/auth/concepts/external-identity-providers/)
+ [Flottement](https://docs.amplify.aws/flutter/build-a-backend/auth/concepts/external-identity-providers/)
+ [Android](https://docs.amplify.aws/android/build-a-backend/auth/concepts/external-identity-providers/)

## Configuration de la connexion gérée avec la console Amazon Cognito
<a name="set-up-managed-login"></a>

La première exigence pour la connexion gérée et l'interface utilisateur hébergée est un domaine de pool d'utilisateurs. Dans la console des groupes d'utilisateurs, accédez à l'onglet **Domaine** de votre groupe d'utilisateurs et ajoutez un domaine **Cognito ou un domaine** **personnalisé**. Vous pouvez également choisir un domaine lors de la création d'un nouveau groupe d'utilisateurs. Pour de plus amples informations, veuillez consulter [Configuration d'un domaine de groupe d'utilisateurs](cognito-user-pools-assign-domain.md). Lorsqu'un domaine est actif dans votre groupe d'utilisateurs, tous les clients de l'application proposent des pages d'authentification publiques sur ce domaine.

Lorsque vous créez ou modifiez un domaine de groupe d'utilisateurs, vous définissez la **version de marque** de votre domaine. Cette version de marque est un choix entre **connexion gérée** ou **interface utilisateur hébergée (classique)**. La version de marque que vous avez choisie s'applique à tous les clients de l'application qui utilisent les services de connexion de votre domaine.

L'étape suivante consiste à créer un [client d'application](user-pool-settings-client-apps.md) à partir de l'onglet **Clients d'applications** de votre groupe d'utilisateurs. Lors de la création d'un client d'application, Amazon Cognito vous demande des informations sur votre application, puis vous invite à sélectionner une URL de **retour**. L'URL de retour est également appelée URL de la partie utilisatrice (RP), URI de redirection et URL de rappel. Il s'agit de l'URL à partir de laquelle votre application s'exécute, par exemple `https://www.example.com` ou`myapp://example`.

Une fois que vous avez configuré un client de domaine et d'application avec un style de marque dans votre groupe d'utilisateurs, vos pages de connexion gérées sont disponibles sur Internet.

## Affichage de votre page de connexion
<a name="view-login-pages"></a>

Dans la console Amazon Cognito, cliquez sur le bouton **Afficher les pages de connexion** dans l'onglet **Pages de connexion** de votre client d'application, dans le menu **Clients de l'application**. Ce bouton vous amène à une page de connexion dans le domaine de votre groupe d'utilisateurs avec les paramètres de base suivants.
+ ID du client d’application.
+ Demande d’octroi de code d’autorisation
+ Demande pour tous les portées que vous avez activées pour le client d’application actuel
+ Première URL de rappel de la liste pour le client d’application actuel

Le bouton **Afficher la page de connexion** est utile lorsque vous souhaitez tester les fonctions de base de vos pages de connexion gérées. Vos pages de connexion correspondront à la **version de marque** que vous avez attribuée au [domaine de votre groupe d'utilisateurs](cognito-user-pools-assign-domain.md). Vous pouvez personnaliser votre URL de connexion avec des paramètres supplémentaires et modifiés. Dans la plupart des cas, les paramètres générés automatiquement par le lien **Afficher la page de connexion** ne répondent pas entièrement aux besoins de votre application. Vous devez alors personnaliser l’URL que votre application appelle lorsqu’elle se connecte à vos utilisateurs. Pour de plus amples informations sur les clés et les valeurs de paramètre, veuillez consulter [Points de terminaison du groupe d'utilisateurs et référence de connexion gérée](cognito-userpools-server-contract-reference.md).

La page Web de connexion utilise le format d'URL suivant. Cet exemple demande l’octroi d’un code d’autorisation avec le paramètre `response_type=code`.

```
https://<your domain>/oauth2/authorize?response_type=code&client_id=<your app client id>&redirect_uri=<your relying-party url>
```

Vous pouvez rechercher la chaîne de domaine de votre groupe d'utilisateurs dans le menu **Domaine** de votre groupe d'utilisateurs. Dans le menu **Clients de l'application**, vous pouvez identifier le client de l'application IDs, son rappel URLs, ses étendues autorisées et les autres configurations.

Lorsque vous accédez au point de terminaison `/oauth2/authorize` avec vos paramètres personnalisés, Amazon Cognito vous redirige vers le point de terminaison `/oauth2/login` ou, si vous avez un paramètre `identity_provider` ou `idp_identifier`, vous redirige en mode silencieux vers la page de connexion de votre IdP.

**Exemple de demande de subvention implicite**  
Vous pouvez consulter votre page Web de connexion avec l'URL suivante pour l'attribution de code implicite où`response_type=token`. Après une connexion réussie, Amazon Cognito renvoie des jetons de groupe d’utilisateurs à la barre d’adresse de votre navigateur web.

```
            https://mydomain.auth.us-east-1.amazoncognito.com/authorize?response_type=token&client_id=1example23456789&redirect_uri=https://mydomain.example.com
```

Les jetons d’identité et d’accès apparaissent sous forme de paramètres ajoutés à votre URL de redirection.

Voici un exemple de réponse à une demande d’octroi implicite.

```
            https://auth.example.com/#id_token=eyJraaBcDeF1234567890&access_token=eyJraGhIjKlM1112131415&expires_in=3600&token_type=Bearer  
```

## Personnalisation de vos pages d'authentification
<a name="cognito-user-pools-app-integration-customize-hosted-ui"></a>

Dans le passé, Amazon Cognito hébergeait uniquement des pages de connexion dotées de l'*interface utilisateur hébergée* classique, une conception simple qui confère un aspect universel aux pages Web d'authentification. Vous pouvez personnaliser les groupes d'utilisateurs d'Amazon Cognito à l'aide d'une image de logo et modifier certains styles à l'aide d'un fichier spécifiant certaines valeurs de style CSS. Plus tard, Amazon Cognito a introduit *Managed Login*, un service d'authentification hébergé mis à jour. La connexion gérée est mise à jour look-and-feel avec l'*éditeur de marque*. L'éditeur de marque est un éditeur visuel sans code et propose une suite d'options plus large que l'expérience de personnalisation de l'interface utilisateur hébergée. La connexion gérée a également introduit des images d'arrière-plan personnalisées et un thème de mode sombre.

Vous pouvez alterner entre la connexion gérée et les expériences de marque de l'interface utilisateur hébergée dans les groupes d'utilisateurs. Pour en savoir plus sur la personnalisation de vos pages de connexion gérées, consultez[Appliquer une image de marque aux pages de connexion gérées](managed-login-branding.md).

## Ce qu'il faut savoir sur la connexion gérée et l'interface utilisateur hébergée
<a name="managed-login-things-to-know"></a>

**Le cookie de session de connexion gérée et d'interface utilisateur hébergée d'une heure**  
Lorsqu'un utilisateur se connecte via vos pages de connexion ou via un fournisseur tiers, Amazon Cognito place un cookie dans son navigateur. Avec ce cookie, les utilisateurs peuvent se reconnecter avec la même méthode d'authentification pendant une heure. Lorsqu'ils se connectent à l'aide du cookie de leur navigateur, ils obtiennent de nouveaux jetons dont la durée est spécifiée dans la configuration du client de votre application. Les modifications apportées aux attributs ou aux facteurs d'authentification des utilisateurs n'ont aucun effet sur leur capacité à se reconnecter avec le cookie de leur navigateur.

L'authentification à l'aide du cookie de session ne rétablit pas la durée du cookie à une heure supplémentaire. Les utilisateurs doivent se reconnecter s'ils tentent d'accéder à vos pages de connexion plus d'une heure après leur dernière authentification interactive réussie.

**Confirmation des comptes utilisateurs et vérification des attributs des utilisateurs**  
Pour les utilisateurs [locaux du groupe d'utilisateurs](cognito-terms.md#terms-localuser), la connexion gérée et l'interface utilisateur hébergée fonctionnent mieux lorsque vous configurez votre groupe d'utilisateurs pour **autoriser Cognito à envoyer automatiquement des messages de vérification et de** confirmation. Lorsque vous activez ce paramètre, Amazon Cognito envoie un message contenant un code de confirmation aux utilisateurs qui s’inscrivent. Lorsque vous confirmez les utilisateurs en tant qu'administrateur du groupe d'utilisateurs, vos pages de connexion affichent un message d'erreur après l'inscription. Dans cet état, Amazon Cognito a créé le nouvel utilisateur, mais n’a pas été en mesure d’envoyer de message de vérification. Vous pouvez toujours confirmer les utilisateurs en tant qu’administrateurs, mais ils peuvent contacter votre service d’assistance après avoir rencontré une erreur. Pour plus d’informations sur la confirmation administrative, consultez [Autorisation des utilisateurs à s’inscrire dans votre application, mais en les confirmant en tant qu’administrateur du groupe d’utilisateurs](signing-up-users-in-your-app.md#signing-up-users-in-your-app-and-confirming-them-as-admin).

**Étendue des opérations de connexion gérée**  
La connexion gérée et l'interface utilisateur hébergée classique prennent en charge l'inscription, la connexion et la gestion des mots de passe. Cela inclut la finalisation de la connexion par authentification multifactorielle (MFA) et l'enregistrement des authentificateurs WebAuthn. La connexion gérée ne prend pas en charge la gestion des profils en libre-service des utilisateurs, comme les modifications d'attributs et la définition des préférences MFA. Vous devez implémenter la gestion des profils dans le code de votre propre application. La connexion gérée ne permet pas non plus de confirmer les modifications d'attributs lorsque vous mettez à jour des adresses e-mail et des numéros de téléphone en tant qu'administrateur avec l'opération [AdminUpdateUserAttributes](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_AdminUpdateUserAttributes.html)API.

**Afficher les modifications apportées à la configuration**  
Si vous modifiez le style de vos pages et qu'elles n'apparaissent pas immédiatement, attendez quelques minutes, puis actualisez la page.

**Décoder les jetons du groupe d’utilisateurs**  
Les jetons du pool d'utilisateurs Amazon Cognito sont signés à l'aide d'un RS256 algorithme. Vous pouvez décoder et vérifier les jetons du groupe d'utilisateurs à l'aide AWS Lambda de. Consultez la section [Décoder et vérifier que les jetons Amazon Cognito JWT](https://github.com/awslabs/aws-support-tools/tree/master/Cognito/decode-verify-jwt) sont activés. GitHub

**Version de TLS**  
Les pages de connexion gérées et d'interface utilisateur hébergées nécessitent un cryptage pendant le transit. Les domaines du groupe d'utilisateurs fournis par Amazon Cognito nécessitent que les navigateurs des utilisateurs négocient une version TLS minimale de 1.2. Les domaines personnalisés prennent en charge les connexions au navigateur avec TLS version 1.2. L'interface utilisateur hébergée (classique) **ne nécessite pas** le protocole TLS 1.2 pour les domaines personnalisés, mais la nouvelle connexion gérée **nécessite** la version 1.2 du protocole TLS à la fois pour les domaines personnalisés et les domaines préfixes. Amazon Cognito gérant la configuration de vos services de domaine, vous ne pouvez pas modifier les exigences TLS du domaine de votre groupe d'utilisateurs.

**Stratégies CORS**  
Ni la connexion gérée ni l'interface utilisateur hébergée ne prennent en charge les politiques d'origine personnalisées de partage de ressources entre origines (CORS). Une politique CORS empêcherait les utilisateurs de transmettre des paramètres d'authentification dans leurs demandes. Implémentez plutôt une politique CORS dans le front-end de votre application. Amazon Cognito renvoie un en-tête de `Access-Control-Allow-Origin: *` réponse aux demandes adressées aux points de terminaison suivants.

1. [Point de terminaison de jeton](token-endpoint.md)

1. [Point de terminaison de révocation](revocation-endpoint.md)

1. [Point de terminaison UserInfo](userinfo-endpoint.md)

**Cookies**  
La connexion gérée et l'interface utilisateur hébergée installent des cookies dans les navigateurs des utilisateurs. Les cookies sont conformes aux exigences de certains navigateurs selon lesquelles les sites ne placent pas de cookies tiers. Ils s'appliquent uniquement aux points de terminaison de votre groupe d'utilisateurs et incluent les éléments suivants :
+ Un `XSRF-TOKEN` cookie pour chaque demande.
+ `csrf-state`Cookie destiné à assurer la cohérence de la session lorsqu'un utilisateur est redirigé.
+ `csrf-state-legacy`Cookie destiné à assurer la cohérence des sessions, lu par Amazon Cognito comme solution de rechange lorsque votre navigateur ne prend pas en charge cet attribut. `SameSite`
+ Cookie de `cognito` session qui conserve les tentatives de connexion réussies pendant une heure.
+ `lang`Cookie qui préserve le choix de [langue de localisation](#managed-login-localization) de l'utilisateur lors de la connexion gérée.
+ `page-data`Cookie qui conserve les données requises lorsqu'un utilisateur navigue entre les pages de connexion gérées.

Dans iOS, vous pouvez [bloquer tous les cookies](https://support.apple.com/en-us/105082). Ce paramètre n'est pas compatible avec la connexion gérée ou l'interface utilisateur hébergée. Pour travailler avec les utilisateurs susceptibles d'activer ce paramètre, intégrez l'authentification du groupe d'utilisateurs dans une application iOS native dotée d'un AWS SDK. Dans ce scénario, vous pouvez créer votre propre stockage de session qui n'est pas basé sur les cookies.

**Effets du changement de version de connexion gérée**  
Tenez compte des effets suivants de l'ajout de domaines et de la définition de la version de connexion gérée.
+ Lorsque vous ajoutez un domaine préfixe, que ce soit avec une connexion gérée ou une interface utilisateur hébergée (classique), vos pages de connexion peuvent prendre jusqu'à 60 secondes avant que vos pages de connexion ne soient disponibles.
+ Lorsque vous ajoutez un domaine personnalisé, que ce soit avec une connexion gérée ou une interface utilisateur hébergée (classique), vos pages de connexion peuvent prendre jusqu'à cinq minutes avant que vos pages de connexion ne soient disponibles.
+ Lorsque vous modifiez la version de marque de votre domaine, il peut s'écouler jusqu'à quatre minutes avant que vos pages de connexion ne soient disponibles dans la nouvelle version de marque.
+ Lorsque vous passez de la connexion gérée à l'image de marque de l'interface utilisateur hébergée (classique), Amazon Cognito ne gère pas les sessions utilisateur. Ils doivent se reconnecter avec la nouvelle interface.

**Style par défaut**  
Lorsque vous créez un client d'application dans le AWS Management Console, Amazon Cognito attribue automatiquement un style de marque à votre client d'application. Lorsque vous créez un client d'application par programmation avec cette [CreateUserPoolClient](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateUserPoolClient.html)opération, aucun style de marque n'est créé. La connexion gérée n'est pas disponible pour un client d'application créé à l'aide d'un AWS SDK tant que vous n'en avez pas créé un avec une [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)demande.

**La demande d'authentification de connexion gérée arrive à expiration**  
Amazon Cognito annule les demandes d'authentification qui ne sont pas traitées dans les cinq minutes et redirige l'utilisateur vers une connexion gérée. La page affiche un message d'erreur `Something went wrong`.

# Configuration d'un domaine de groupe d'utilisateurs
<a name="cognito-user-pools-assign-domain"></a>

La configuration d'un domaine est facultative lors de la configuration d'un groupe d'utilisateurs. Un domaine de pool d'utilisateurs héberge des fonctionnalités pour l'authentification des utilisateurs, la fédération avec des fournisseurs tiers et les flux OpenID Connect (OIDC). Il dispose d'une *connexion gérée*, d'une interface prédéfinie pour les opérations clés telles que l'inscription, la connexion et la récupération du mot de passe. Il héberge également les points de terminaison OpenID Connect (OIDC) standard tels que authorize[,](authorization-endpoint.md) [UserInfo](userinfo-endpoint.md) et [token, for machine-to-machine (M2M) authorization](token-endpoint.md) et d'autres flux d'authentification et d'autorisation OIDC et 2.0. OAuth 

Les utilisateurs s'authentifient à l'aide de pages de connexion gérées sur le domaine associé à votre groupe d'utilisateurs. Deux options s'offrent à vous pour configurer ce domaine : vous pouvez soit utiliser le domaine hébergé Amazon Cognito par défaut, soit configurer un domaine personnalisé dont vous êtes le propriétaire.

L'option de domaine personnalisé offre davantage d'options de flexibilité, de sécurité et de contrôle. Par exemple, un domaine familier appartenant à une organisation peut encourager la confiance des utilisateurs et rendre le processus de connexion plus intuitif. Cependant, l'approche du domaine personnalisé nécessite des frais supplémentaires, tels que la gestion du certificat SSL et de la configuration DNS.

Les points de terminaison de découverte OIDC, `/.well-known/openid-configuration` pour les points de terminaison URLs et `/.well-known/jwks.json` pour les clés de signature de jetons, ne sont pas hébergés sur votre domaine. Pour de plus amples informations, veuillez consulter [Points de terminaison du fournisseur d'identité et des parties utilisatrices](federation-endpoints.md).

Comprendre comment configurer et gérer le domaine de votre groupe d'utilisateurs est une étape importante de l'intégration de l'authentification dans votre application. La connexion à l'aide de l'API des groupes d'utilisateurs et d'un AWS SDK peut être une alternative à la configuration d'un domaine. Le modèle basé sur l'API fournit des jetons directement dans une réponse d'API, mais pour les implémentations qui utilisent les fonctionnalités étendues des groupes d'utilisateurs en tant qu'IdP OIDC, vous devez configurer un domaine. Pour plus d'informations sur les modèles d'authentification disponibles dans les groupes d'utilisateurs, consultez[Comprendre l'API, l'OIDC et l'authentification par pages de connexion gérées](authentication-flows-public-server-side.md#user-pools-API-operations).

**Topics**
+ [Ce qu'il faut savoir sur les domaines du pool d'utilisateurs](#cognito-user-pools-assign-domain-things-to-know)
+ [Utilisation du domaine de préfixe Amazon Cognito pour la connexion gérée](cognito-user-pools-assign-domain-prefix.md)
+ [Utiliser votre propre domaine pour la connexion gérée](cognito-user-pools-add-custom-domain.md)

## Ce qu'il faut savoir sur les domaines du pool d'utilisateurs
<a name="cognito-user-pools-assign-domain-things-to-know"></a>

Les domaines du pool d'utilisateurs constituent un point de service pour les utilisateurs de l'OIDC dans vos applications et pour les éléments de l'interface utilisateur. Tenez compte des détails suivants lorsque vous planifiez la mise en œuvre d'un domaine pour votre groupe d'utilisateurs.

**Termes réservés**  
Vous ne pouvez pas utiliser le texte `aws` ou `amazon` `cognito` le nom d'un domaine de préfixe Amazon Cognito.

**Les points de terminaison de découverte se trouvent dans un domaine différent**  
Les [points de terminaison de découverte](federation-endpoints.md) du groupe `.well-known/openid-configuration` d'utilisateurs `.well-known/jwks.json` ne se trouvent pas sur le domaine personnalisé ou préfixe de votre groupe d'utilisateurs. Le chemin d'accès à ces points de terminaison est le suivant.
+ `https://cognito-idp.Region.amazonaws.com/your user pool ID/.well-known/openid-configuration`
+ `https://cognito-idp.Region.amazonaws.com/your user pool ID/.well-known/jwks.json`

**Heure effective des changements de domaine**  
Amazon Cognito peut prendre jusqu'à une minute pour lancer ou mettre à jour la version de marque d'un domaine préfixe. La propagation des modifications apportées à un domaine personnalisé peut prendre jusqu'à cinq minutes. La propagation des nouveaux domaines personnalisés peut prendre jusqu'à une heure.

**Domaines personnalisés et préfixes à la fois**  
Vous pouvez configurer un groupe d'utilisateurs avec à la fois un domaine personnalisé et un domaine préfixe appartenant AWSà. Les [points de terminaison de découverte](federation-endpoints.md) du groupe d'utilisateurs étant hébergés dans un domaine différent, ils ne desservent que le *domaine personnalisé*. Par exemple, vous `openid-configuration` fournirez une valeur unique pour `"authorization_endpoint"` of`"https://auth.example.com/oauth2/authorize"`.

Lorsque vous avez à la fois des domaines personnalisés et des domaines préfixes dans un groupe d'utilisateurs, vous pouvez utiliser le domaine personnalisé avec toutes les fonctionnalités d'un fournisseur OIDC. Le domaine de préfixe d'un groupe d'utilisateurs avec cette configuration n'a pas de découverte ni de token-signing-key point de terminaison et doit être utilisé en conséquence.

**Domaines personnalisés préférés comme identifiant de partie fiable pour la clé d'accès**  
Lorsque vous configurez l'authentification du groupe d'utilisateurs à l'aide de [clés d'accès](amazon-cognito-user-pools-authentication-flow-methods.md#amazon-cognito-user-pools-authentication-flow-methods-passkey), vous devez définir un ID de partie de confiance (RP). Lorsque vous avez un domaine personnalisé et un domaine préfixe, vous pouvez définir l'ID RP uniquement comme domaine personnalisé. **Pour définir un domaine préfixe comme ID RP dans la console Amazon Cognito, supprimez votre domaine personnalisé ou entrez le nom de domaine complet (FQDN) du domaine préfixe en tant que domaine tiers.**

**N'utilisez pas de domaines personnalisés à différents niveaux de votre hiérarchie de domaines**  
*Vous pouvez configurer des groupes d'utilisateurs distincts pour avoir des domaines personnalisés dans le même domaine de premier niveau (TLD), par exemple *auth.example.com et auth2.example.com.** Le cookie de session de connexion géré est valide pour un domaine personnalisé et tous les sous-domaines, par exemple *\$1.auth.example.com*. *De ce fait, aucun utilisateur de vos applications ne doit accéder à la connexion gérée pour un domaine ou un sous-domaine parent.* Lorsque des domaines personnalisés utilisent le même TLD, conservez-les au même niveau de sous-domaine.

Supposons que vous ayez un groupe d'utilisateurs avec le domaine personnalisé *auth.example.com.* Vous créez ensuite un autre groupe d'utilisateurs et attribuez le domaine personnalisé *uk.auth.example.com.* . Un utilisateur se connecte avec *auth.example.com.* et obtient un cookie que son navigateur présente à n'importe quel site Web dans le chemin générique *\$1.auth.example.com*. Ils essaient ensuite de se connecter à *uk.auth.example.com.* . Ils transmettent un cookie non valide au domaine de votre groupe d'utilisateurs et reçoivent une erreur au lieu d'une invite de connexion. *En revanche, un utilisateur possédant un cookie pour *\$1.auth.example.com* n'a aucun problème à démarrer une session de connexion sur auth2.example.com.*

**Version de marque**  
Lorsque vous créez un domaine, vous définissez une **version de marque**. Vos options sont la nouvelle expérience de connexion gérée et l'expérience d'interface utilisateur hébergée classique. Ce choix s'applique à tous les clients d'applications hébergeant des services sur votre domaine.

# Utilisation du domaine de préfixe Amazon Cognito pour la connexion gérée
<a name="cognito-user-pools-assign-domain-prefix"></a>

L'expérience par défaut pour la connexion gérée est hébergée sur un domaine AWS propriétaire. Cette approche présente un faible obstacle à l'entrée : choisissez un nom de préfixe et il est actif, mais elle ne possède pas les fonctionnalités dignes de confiance d'un domaine personnalisé. Il n'y a pas de différence de coût entre l'option de domaine Amazon Cognito et l'option de domaine personnalisé. La seule différence réside dans le domaine de l'adresse Web vers laquelle vous dirigez vos utilisateurs. Dans les cas de redirections d'IdP tiers et de flux d'informations d'identification client, le domaine hébergé a peu d'effet visible. Un domaine personnalisé est préférable dans les cas où vos utilisateurs se connectent à l'aide d'une connexion gérée et interagissent avec un domaine d'authentification qui ne correspond pas au domaine de l'application.

Le domaine Amazon Cognito hébergé possède le préfixe de votre choix, mais il est hébergé sur le domaine racine. `amazoncognito.com` Voici un exemple :

```
https://cognitoexample.auth.ap-south-1.amazoncognito.com
```

Tous les domaines de préfixes suivent ce format :`prefix`. `auth`. *`Région AWS code`*. `amazoncognito`. `com`. Les groupes d'utilisateurs de [domaines personnalisés](cognito-user-pools-add-custom-domain.md) peuvent héberger la connexion gérée ou les pages d'interface utilisateur hébergées sur n'importe quel domaine que vous possédez.

**Note**  
Pour renforcer la sécurité de vos applications Amazon Cognito, les domaines parents des points de terminaison du groupe d'utilisateurs sont enregistrés dans la [liste des suffixes publics (PSL)](https://publicsuffix.org/). La PSL aide les navigateurs Web de vos utilisateurs à comprendre de manière cohérente les points de terminaison de votre groupe d'utilisateurs et les cookies qu'ils installent.  
Les domaines parents du groupe d'utilisateurs prennent les formats suivants.  

```
auth.Region.amazoncognito.com
auth-fips.Region.amazoncognito.com
```

Pour ajouter un client d'application et un domaine de groupe d'utilisateurs avec le AWS Management Console[Création d’un client d’application](user-pool-settings-client-apps.md#cognito-user-pools-app-idp-settings-console-create).

**Topics**
+ [Conditions préalables](#cognito-user-pools-assign-domain-prefix-prereq)
+ [Configuration d'un préfixe de domaine Amazon Cognito](#cognito-user-pools-assign-domain-prefix-step-1)
+ [Vérifiez votre page de connexion](#cognito-user-pools-assign-domain-prefix-verify)

## Conditions préalables
<a name="cognito-user-pools-assign-domain-prefix-prereq"></a>

Avant de commencer, vous avez besoin des éléments suivants :
+ Un groupe d’utilisateurs avec un client d’appli. Pour de plus amples informations, veuillez consulter [Démarrage avec les groupes d'utilisateurs](getting-started-user-pools.md).

## Configuration d'un préfixe de domaine Amazon Cognito
<a name="cognito-user-pools-assign-domain-prefix-step-1"></a>

Vous pouvez utiliser l'API AWS Management Console ou l'API AWS CLI or pour configurer un domaine de groupe d'utilisateurs.

------
#### [ Amazon Cognito console ]

**Configurer un domaine**

1. Accédez au menu **Domaine** sous **Branding**.

1. À côté de **Domaine**, choisissez **Actions**, puis sélectionnez **Créer un domaine Cognito**. Si vous avez déjà configuré un domaine de préfixe de groupe d'utilisateurs, choisissez **Supprimer le domaine Cognito** avant de créer votre nouveau domaine personnalisé.

1. Saisissez un préfixe de domaine disponible à utiliser avec un **domaine Amazon Cognito**. Pour plus d'informations sur la configuration d'un **domaine personnalisé**, consultez[Utiliser votre propre domaine pour la connexion gérée](cognito-user-pools-add-custom-domain.md).

1. Choisissez une **version de marque**. La version de votre marque s'applique à toutes les pages interactives de ce domaine. Votre groupe d'utilisateurs peut héberger une connexion gérée ou une image de marque d'interface utilisateur hébergée pour tous les clients de l'application.
**Note**  
*Vous pouvez avoir un domaine personnalisé et un domaine préfixe, mais Amazon Cognito ne sert que le point de terminaison `/.well-known/openid-configuration` du domaine personnalisé.*

1. Choisissez **Créer**.

------
#### [ CLI/API ]

Utilisez les commandes suivantes pour créer un préfixe de domaine et l'attribuer à votre groupe d'utilisateurs.

**Pour configurer un domaine de groupe d'utilisateurs**
+ AWS CLI: `aws cognito-idp create-user-pool-domain`

  **Exemple** : `aws cognito-idp create-user-pool-domain --user-pool-id <user_pool_id> --domain <domain_name> --managed-login-version 2`
+ Fonctionnement de l'API des groupes d'utilisateurs : [CreateUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateUserPoolDomain.html)

**Pour obtenir des informations sur un domaine**
+ AWS CLI: `aws cognito-idp describe-user-pool-domain`

  **Exemple** : `aws cognito-idp describe-user-pool-domain --domain <domain_name>`
+ Fonctionnement de l'API des groupes d'utilisateurs : [DescribeUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeUserPoolDomain.html)

**Pour supprimer un domaine**
+ AWS CLI: `aws cognito-idp delete-user-pool-domain`

  **Exemple** : `aws cognito-idp delete-user-pool-domain --domain <domain_name>`
+ Fonctionnement de l'API des groupes d'utilisateurs : [DeleteUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DeleteUserPoolDomain.html)

------

## Vérifiez votre page de connexion
<a name="cognito-user-pools-assign-domain-prefix-verify"></a>
+ Vérifiez que la page de connexion est disponible à partir du domaine hébergé par Amazon Cognito.

  ```
  https://<your_domain>/login?response_type=code&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>
  ```

Votre domaine est affiché sur la page **Domain name (Nom de domaine)** de la console Amazon Cognito. Votre ID de client d'application et votre URL de rappel s'affichent à la page **App client settings (Paramètres de client d'application)**.

# Utiliser votre propre domaine pour la connexion gérée
<a name="cognito-user-pools-add-custom-domain"></a>

Après avoir configuré un client d'application, vous pouvez configurer votre groupe d'utilisateurs avec un domaine personnalisé pour les services de domaine de [connexion gérée](cognito-user-pools-managed-login.md). Avec un domaine personnalisé, les utilisateurs peuvent se connecter à votre application en utilisant leur propre adresse Web au lieu du [domaine `amazoncognito.com` préfixe](cognito-user-pools-assign-domain-prefix.md) par défaut. Les domaines personnalisés renforcent la confiance des utilisateurs dans votre application avec un nom de domaine familier, en particulier lorsque le domaine racine correspond au domaine qui héberge votre application. Les domaines personnalisés peuvent améliorer la conformité aux exigences de sécurité de l'organisation.

Un domaine personnalisé comporte certaines conditions préalables, notamment un groupe d'utilisateurs, un client d'application et un domaine Web que vous possédez. Les domaines personnalisés nécessitent également un certificat SSL pour le domaine personnalisé, géré par AWS Certificate Manager (ACM) dans l'est des États-Unis (Virginie du Nord). Amazon Cognito crée une CloudFront distribution Amazon, sécurisée en transit avec votre certificat ACM. Comme le domaine vous appartient, vous devez créer un enregistrement DNS qui dirige le trafic vers la CloudFront distribution de votre domaine personnalisé.

Une fois ces éléments prêts, vous pouvez ajouter le domaine personnalisé à votre groupe d'utilisateurs via la console ou l'API Amazon Cognito. Cela implique de spécifier le nom de domaine et le certificat SSL, puis de mettre à jour votre configuration DNS avec l'alias cible fourni. Après avoir apporté ces modifications, vous pouvez vérifier que la page de connexion est accessible sur votre domaine personnalisé.

La méthode la plus simple pour créer un domaine personnalisé est d'utiliser une zone hébergée publique dans Amazon Route 53. La console Amazon Cognito peut créer les enregistrements DNS appropriés en quelques étapes. Avant de commencer, pensez à [créer une zone hébergée Route 53](https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/CreatingHostedZone.html) pour un domaine ou un sous-domaine dont vous êtes le propriétaire.

**Topics**
+ [Ajout d’un domaine personnalisé à un groupe d’utilisateurs](#cognito-user-pools-add-custom-domain-adding)
+ [Conditions préalables](#cognito-user-pools-add-custom-domain-prereq)
+ [Étape 1 : saisissez votre nom de domaine personnalisé.](#cognito-user-pools-add-custom-domain-console-step-1)
+ [Étape 2 : Ajout d’une cible d’alias et d’un sous-domaine](#cognito-user-pools-add-custom-domain-console-step-2)
+ [Étape 3 : Vérification de votre page de connexion](#cognito-user-pools-add-custom-domain-console-step-3)
+ [Modification du certificat SSL de votre domaine personnalisé](#cognito-user-pools-add-custom-domain-changing-certificate)

## Ajout d’un domaine personnalisé à un groupe d’utilisateurs
<a name="cognito-user-pools-add-custom-domain-adding"></a>

Pour ajouter un domaine personnalisé à votre groupe d’utilisateurs, vous spécifiez le nom de domaine dans la console Amazon Cognito et fournissez un certificat que vous gérez avec [AWS Certificate Manager](https://docs.aws.amazon.com/acm/latest/userguide/) (ACM). Une fois que vous avez ajouté votre domaine, Amazon Cognito fournit une cible d’alias que vous ajoutez à votre configuration DNS.

## Conditions préalables
<a name="cognito-user-pools-add-custom-domain-prereq"></a>

Avant de commencer, vous avez besoin des éléments suivants :
+ Un groupe d’utilisateurs avec un client d’appli. Pour de plus amples informations, veuillez consulter [Démarrage avec les groupes d'utilisateurs](getting-started-user-pools.md).
+ Un domaine Web que vous possédez. Son *domaine parent* doit avoir un **enregistrement A** DNS valide. Vous pouvez attribuer n’importe quelle valeur à cet enregistrement. Le parent peut être la racine du domaine ou un domaine enfant qui se trouve à un niveau supérieur dans la hiérarchie du domaine. Par exemple, si votre domaine personnalisé est *auth.xyz.example.com*, Amazon Cognito doit être en mesure de résoudre *xyz.example.com* à une adresse IP. Pour éviter tout impact accidentel sur l'infrastructure du client, Amazon Cognito ne prend pas en charge l'utilisation de domaines de premier niveau (TLDs) pour les domaines personnalisés. Pour plus d’informations, consultez [Noms de domaine](https://tools.ietf.org/html/rfc1035).
+ Possibilité de créer un sous-domaine pour votre domaine personnalisé. Nous recommandons l'**authentification pour le** nom de votre sous-domaine. Par exemple : *auth.example.com*.
**Note**  
Vous pouvez avoir besoin d’obtenir un nouveau certificat pour le sous-domaine de votre domaine personnalisé si vous ne disposez pas d’un [certificat générique](https://en.wikipedia.org/wiki/Wildcard_certificate).
+ Un SSL/TLS certificat public géré par ACM dans l'est des États-Unis (Virginie du Nord). Le certificat doit être au format us-east-1 car il sera associé à une distribution CloudFront dans un service global.
+ Clients de navigateur qui prennent en charge l'indication du nom du serveur (SNI). La CloudFront distribution qu'Amazon Cognito attribue aux domaines personnalisés nécessite le SNI. Vous ne pouvez pas modifier ce paramètre. Pour plus d'informations sur le SNI dans les CloudFront distributions, consultez [Utiliser le SNI pour répondre aux requêtes HTTPS](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/cnames-https-dedicated-ip-or-sni.html#cnames-https-sni) dans le manuel *Amazon CloudFront Developer Guide*.
+ Application qui permet à votre serveur d'autorisation de groupe d'utilisateurs d'ajouter des cookies aux sessions utilisateur. Amazon Cognito définit plusieurs cookies obligatoires pour les pages de connexion gérées. Cela inclut `cognito`, `cognito-fl` et `XSRF-TOKEN`. Bien que chaque cookie soit conforme aux limites de taille du navigateur, les modifications apportées à la configuration de votre groupe d'utilisateurs peuvent entraîner une augmentation de la taille des cookies de connexion gérés. Un service intermédiaire tel qu'un Application Load Balancer (ALB) placé devant votre domaine personnalisé peut imposer une taille d'en-tête maximale ou une taille totale de cookie. Si votre application définit également ses propres cookies, les sessions de vos utilisateurs peuvent dépasser ces limites. Pour éviter les conflits de taille, nous recommandons à votre application de ne pas installer de cookies sur le sous-domaine qui héberge les services de domaine de votre groupe d'utilisateurs.
+ Autorisation de mettre à jour CloudFront les distributions Amazon. Vous pouvez le faire en attachant la déclaration de politique IAM suivante à un utilisateur de votre compte Compte AWS :

------
#### [ JSON ]

****  

  ```
  {
      "Version":"2012-10-17",		 	 	 
      "Statement": [
           {
              "Sid": "AllowCloudFrontUpdateDistribution",
              "Effect": "Allow",
              "Action": [
                  "cloudfront:updateDistribution"
              ],
              "Resource": [
                  "*"
              ]
          }
      ]
  }
  ```

------

  Pour plus d'informations sur l'autorisation d'actions dans CloudFront, consultez la section [Utilisation de politiques basées sur l'identité (stratégies IAM](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/access-control-managing-permissions.html)) pour. CloudFront

  Amazon Cognito utilise initialement vos autorisations IAM pour configurer la CloudFront distribution, mais celle-ci est gérée par. AWS Vous ne pouvez pas modifier la configuration de la CloudFront distribution qu'Amazon Cognito a associée à votre groupe d'utilisateurs. Par exemple, vous ne pouvez pas mettre à jour les versions TLS prises en charge dans la politique de sécurité.

## Étape 1 : saisissez votre nom de domaine personnalisé.
<a name="cognito-user-pools-add-custom-domain-console-step-1"></a>

Vous pouvez ajouter votre domaine à votre groupe d’utilisateurs à l’aide de la console Amazon Cognito ou de l’API.

------
#### [ Amazon Cognito console ]

**Pour ajouter votre domaine à votre groupe d’utilisateurs à partir de la console Amazon Cognito :**

1. Accédez au menu **Domaine** sous **Branding**.

1. En regard de **Domaine**, choisissez **Actions** et sélectionnez **Créer un nom de domaine personnalisé** ou **Créer un nom de domaine Amazon Cognito**. Si vous avez déjà configuré un domaine personnalisé pour un groupe d'utilisateurs, choisissez **Supprimer le domaine personnalisé** avant de créer votre nouveau domaine personnalisé.

1. À côté de **Domaine**, choisissez **Actions**, puis sélectionnez **Créer un domaine personnalisé**. Si vous avez déjà configuré un domaine personnalisé, choisissez **Supprimer le domaine personnalisé** pour supprimer le domaine existant avant de créer votre nouveau domaine personnalisé.

1. Pour **Domaine personnalisé**, saisissez l’URL du domaine que vous souhaitez utiliser avec Amazon Cognito. Votre nom de domaine peut uniquement contenir des lettres minuscules, des chiffres et des traits d’union. N’utilisez pas de tiret comme premier ou dernier caractère. Utilisez des points pour séparer les noms des sous-domaines.

1. Pour **Certificat ACM**, choisissez le certificat SSL que vous souhaitez utiliser pour votre domaine. Seuls les certificats ACM de l'est des États-Unis (Virginie du Nord) peuvent être utilisés avec un domaine personnalisé Amazon Cognito, quel que soit votre groupe d'utilisateurs. Région AWS 

   Si vous n’avez pas de certificat disponible, vous pouvez utiliser ACM pour allouer un dans la région USA Est (Virginie du Nord). Pour plus d’informations, consultez [Démarrer](https://docs.aws.amazon.com/acm/latest/userguide/gs.html) dans le *Guide de l’utilisateur AWS Certificate Manager *.

1. Choisissez une **version de marque**. Votre version de marque s'applique à toutes les pages interactives de ce domaine. Votre groupe d'utilisateurs peut héberger une connexion gérée ou une image de marque d'interface utilisateur hébergée pour tous les clients de l'application.
**Note**  
*Vous pouvez avoir un domaine personnalisé et un domaine préfixe, mais Amazon Cognito ne sert que le point de terminaison `/.well-known/openid-configuration` du domaine personnalisé.*

1. Choisissez **Créer**.

1. Amazon Cognito vous renvoie au menu **Domaine**. Le message **Créez un enregistrement d’alias dans le DNS de votre domaine**s’affiche. Notez le **domaine** et la **cible d’alias** affichée dans la console. Ils seront utilisés dans l’étape suivante pour diriger le trafic vers votre domaine personnalisé.

------
#### [ API ]

Le corps de [CreateUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateUserPoolDomain.html)demande suivant crée un domaine personnalisé.

```
{
   "Domain": "auth.example.com",
   "UserPoolId": "us-east-1_EXAMPLE",
   "ManagedLoginVersion": 2,
   "CustomDomainConfig": {
    "CertificateArn": "arn:aws:acm:us-east-1:111122223333:certificate/a1b2c3d4-5678-90ab-cdef-EXAMPLE11111"
   }
}
```

------

## Étape 2 : Ajout d’une cible d’alias et d’un sous-domaine
<a name="cognito-user-pools-add-custom-domain-console-step-2"></a>

Au cours de cette étape, vous allez configurer un alias via votre fournisseur de service DNS (Domain Name Server) qui renvoie vers la cible de l’alias de l’étape précédente. Si vous utilisez Amazon Route 53 pour la résolution d’adresse DNS, choisissez la section **Pour ajouter une cible d’alias et un sous-domaine à l’aide de Route 53**.

### Pour ajouter une cible d’alias et un sous-domaine à votre configuration DNS actuelle
<a name="cognito-user-pools-add-custom-domain-console-step-2a"></a>
+ Si vous n’utilisez pas Route 53 pour la résolution d’adresse DNS, vous devez utiliser les outils de configuration de votre fournisseur de services DNS pour ajouter la cible d’alias de l’étape précédente à l’enregistrement DNS de votre domaine. Votre fournisseur DNS doit également configurer le sous-domaine pour votre domaine personnalisé.

### Pour ajouter une cible d’alias et un sous-domaine à l’aide de Route 53
<a name="cognito-user-pools-add-custom-domain-console-step-2b"></a>

1. Connectez-vous à la [console Route 53](https://console.aws.amazon.com/route53/). Si vous y êtes invité, entrez vos AWS informations d'identification.

1. Si vous n'avez pas de zone hébergée publique dans Route 53, créez-en une avec une racine parent de votre domaine personnalisé. Pour plus d'informations, consultez [la section Création d'une zone hébergée publique](https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/CreatingHostedZone.html) dans le *guide du développeur Amazon Route 53*.

   1. Choisissez **Create Hosted Zone** (Créer une zone hébergée).

   1. Entrez le domaine parent, par exemple*auth.example.com*, de votre domaine personnalisé, par exemple*myapp.auth.example.com*, dans la liste des **noms de domaine**.

   1. Saisissez une **description** pour votre zone hébergée.

   1. Choisissez **Zone hébergée publique** comme **type** de zone hébergée pour permettre aux clients publics de résoudre votre domaine personnalisé. Le choix **Zone hébergée privée** n’est pas pris en charge.

   1. Appliquer des **identifications** à votre convenance.

   1. Choisissez **Créer une zone hébergée**.
**Note**  
Vous pouvez également créer une nouvelle zone hébergée pour votre domaine personnalisé avec une délégation définie dans la zone hébergée parent qui dirige les requêtes vers la zone hébergée du sous-domaine. Sinon, créez un enregistrement A. Cette méthode offre plus de flexibilité et de sécurité avec vos zones hébergées. Pour plus d’informations, consultez [Création d’un sous-domaine pour un domaine hébergé via Amazon Route 53](https://aws.amazon.com/premiumsupport/knowledge-center/create-subdomain-route-53/).

1. Sur la page **Hosted Zones (Zones hébergées)**, choisissez le nom de votre zone hébergée.

1. Ajoutez un enregistrement DNS pour le domaine parent de votre domaine personnalisé, si vous n'en avez pas déjà un. Créez un enregistrement DNS pour le domaine parent avec les propriétés suivantes :
   + **Nom de l'enregistrement** : laissez ce champ vide.
   + **Type d'enregistrement** :`A`.
   + **Alias** : ne pas activer.
   + **Valeur** : Entrez la cible de votre choix. Cet enregistrement doit aboutir à *quelque chose*, mais sa valeur n'a pas d'importance pour Amazon Cognito.
   + **TTL** : définissez le TTL de votre choix ou laissez-le par défaut.
   + **Politique de routage** : choisissez **Routage simple**.

1. Choisissez **Créer des enregistrements**. Voici un exemple d'enregistrement pour le domaine *example.com* :

   `example.com. 60 IN A 198.51.100.1`
**Note**  
Amazon Cognito vérifie qu’il existe un enregistrement DNS pour le domaine parent de votre domaine personnalisé, afin de créer une protection contre le piratage accidentel de domaines de production. Si vous n’avez pas d’enregistrement DNS pour le domaine parent, Amazon Cognito renvoie une erreur lorsque vous tentez de définir le domaine personnalisé. Un enregistrement SOA (Start of Authority) n'est pas un enregistrement DNS suffisant aux fins de la vérification du domaine parent.

1. Ajoutez un autre enregistrement DNS pour votre domaine personnalisé avec les propriétés suivantes :
   + **Nom de l'enregistrement** : votre préfixe de domaine personnalisé, par exemple `auth` pour créer un enregistrement pour`auth.example.com`.
   + **Type d'enregistrement** :`A`.
   + **Alias** : Activer.
   + **Acheminer le trafic vers** : Choisissez **Alias vers la distribution Cloudfront**. Entrez l'**Alias cible** que vous avez enregistré précédemment, par exemple`123example.cloudfront.net`.
   + **Politique de routage** : choisissez **Routage simple**.

1. Choisissez **Créer des enregistrements**.
**Note**  
Vos nouveaux enregistrements peuvent prendre environ 60 secondes pour se propager à tous les serveurs DNS Route 53. Vous pouvez utiliser la méthode de l'[GetChange](https://docs.aws.amazon.com/Route53/latest/APIReference/API_GetChange.html)API Route 53 pour vérifier que vos modifications se sont propagées. 

## Étape 3 : Vérification de votre page de connexion
<a name="cognito-user-pools-add-custom-domain-console-step-3"></a>
+ Vérifiez que la page de connexion est disponible à partir de votre domaine personnalisé.

  Connectez-vous avec votre domaine personnalisé et votre sous-domaine en saisissant cette adresse dans votre navigateur. Voici un exemple d'URL d'un domaine personnalisé *example.com* avec le sous-domaine : *auth*

  ```
  https://myapp.auth.example.com/login?response_type=code&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>
  ```

## Modification du certificat SSL de votre domaine personnalisé
<a name="cognito-user-pools-add-custom-domain-changing-certificate"></a>

Si nécessaire, vous pouvez utiliser Amazon Cognito pour modifier le certificat que vous avez appliqué à votre nom de domaine personnalisé.

Généralement, cela est inutile après un renouvellement de certificat avec ACM. Lorsque vous renouvelez votre certificat existant dans ACM, l’ARN de votre certificat demeure le même et votre nom de domaine personnalisé utilise le nouveau certificat automatiquement.

Toutefois, si vous remplacez votre certificat existant par un nouveau certificat, ACM attribue au nouveau certificat un nouvel ARN. Pour appliquer le nouveau certificat à votre domaine personnalisé, vous devez fournir cet ARN à Amazon Cognito.

Une fois que vous avez fourni votre nouveau certificat, Amazon Cognito nécessite jusqu’à 1 heure pour le distribuer à votre domaine personnalisé.

**Avant de commencer**  
Avant de pouvoir modifier votre certificat dans Amazon Cognito, vous devez ajouter votre certificat à ACM. Pour plus d’informations, consultez [Mise en route](https://docs.aws.amazon.com/acm/latest/userguide/gs.html) dans le *Guide de l’utilisateur AWS Certificate Manager *.  
Lorsque vous ajoutez votre certificat à ACM, vous devez choisir USA Est (Virginie du Nord) comme région AWS .

Vous pouvez modifier votre certificat à l’aide de la console Amazon Cognito ou de l’API.

------
#### [ AWS Management Console ]

**Pour renouveler un certificat à partir de la console Amazon Cognito :**

1. Connectez-vous à la console Amazon Cognito AWS Management Console et ouvrez-la à l'adresse. [https://console.aws.amazon.com/cognito/home](https://console.aws.amazon.com/cognito/home)

1. Choisissez **Groupes d’utilisateurs**.

1. Choisissez le groupe d’utilisateurs pour lequel vous souhaitez mettre à jour le certificat.

1. Choisissez le menu **Domaine**.

1. Choisissez **Actions**, **Modifier le certificat ACM**.

1. Sélectionnez le nouveau certificat que vous souhaitez associer à votre domaine personnalisé.

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

------
#### [ API ]

**Pour renouveler un certificat (API Amazon Cognito)**
+ Utilisez l'action [UpdateUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_UpdateUserPoolDomain.html).

------

# Appliquer une image de marque aux pages de connexion gérées
<a name="managed-login-branding"></a>

Vous souhaiterez peut-être fournir une expérience utilisateur cohérente entre votre service d'authentification et votre application. Vous pouvez atteindre cet objectif soit avec des formulaires personnalisés et des opérations d'API principales dans un AWS SDK, soit avec une connexion gérée. La connexion gérée et l'interface utilisateur hébergée classique sont des interfaces Web pour le composant de votre application qui sert à l'authentification auprès des groupes d'utilisateurs. Pour synchroniser vos services d'authentification gérés avec l'expérience utilisateur de votre application, vous disposez de deux options de personnalisation : l'éditeur de marque et le branding de l'interface utilisateur hébergée. Vous pouvez choisir votre expérience préférée dans la console Amazon Cognito et dans le cadre des opérations d'API du groupe d'utilisateurs.

**L'éditeur de marque**  
L'[éditeur de marque](managed-login-brandingeditor.md) est l'option de personnalisation la plus récente pour la nouvelle expérience d'interface utilisateur des groupes d'utilisateurs, [à savoir la connexion gérée](cognito-user-pools-managed-login.md). L'éditeur de marque est un éditeur visuel sans code pour les actifs et le style de connexion gérés, ainsi qu'un ensemble d'opérations d'API pour la configuration programmatique d'un grand nombre d'options de configuration. Les groupes d'utilisateurs que vous configurez avec un [domaine](cognito-user-pools-assign-domain.md) et une connexion gérée affichent automatiquement la version de concepteur de marque de vos pages de connexion.

**Identification de marque (classique) de l'interface utilisateur hébergée**  
L'[interface utilisateur hébergée (classique) offre deux options : modifier un fichier de feuilles de style en cascade (CSS) avec un ensemble fixe d'options de style et ajouter une image de logo personnalisée](hosted-ui-classic-branding.md). Vous pouvez définir ces options dans la console Amazon Cognito ou à l'aide de l'opération [Set UICustomization](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html) API. Au moment du lancement du service, Amazon Cognito ne disposait que de cette option. Les groupes d'utilisateurs que vous configurez avec un [domaine](cognito-user-pools-assign-domain.md) et la version de marque de l'interface utilisateur hébergée affichent automatiquement la version classique de vos pages de connexion. Votre [plan de fonctionnalités](cognito-sign-in-feature-plans.md) peut également prendre en charge uniquement l'interface utilisateur hébergée.

**Note**  
L'éditeur de marque et l'expérience de marque classique modifient les propriétés visuelles de votre service d'authentification hébergé. Actuellement, vous ne pouvez pas modifier le texte affiché sur vos pages de connexion gérées, sauf pour appliquer la localisation dans l'une des différentes langues. Pour plus d'informations sur la localisation, consultez[Localisation des connexions gérées](cognito-user-pools-managed-login.md#managed-login-localization).

## Choisissez une expérience de marque et attribuez des styles
<a name="managed-login-branding-choose"></a>

Dans la console Amazon Cognito, les nouveaux groupes d'utilisateurs utilisent par défaut l'expérience de marque **Managed login**. Les groupes d'utilisateurs que vous avez configurés avant que la connexion gérée ne soit disponible porteront la marque **Hosted UI (classique)**. Vous pouvez passer de la connexion gérée à l'image de marque de l'interface utilisateur hébergée. Lorsque vous modifiez la **version de votre marque**, Amazon Cognito applique immédiatement la modification aux pages interactives du domaine de votre groupe d'utilisateurs. Grâce à la connexion gérée et à l'interface utilisateur hébergée, votre groupe d'utilisateurs peut avoir un style pour chaque client d'application.

Chaque client d'application peut avoir un *style* de marque distinct, mais un domaine de pool d'utilisateurs sert soit à la connexion gérée, soit à l'interface utilisateur hébergée. Un style est l'ensemble des paramètres de personnalisation appliqués à un client d'application. Vous pouvez configurer un [domaine personnalisé et un domaine](cognito-user-pools-add-custom-domain.md) de [préfixe](cognito-user-pools-assign-domain-prefix.md) par groupe d'utilisateurs. Vous pouvez attribuer différentes versions de marque à vos domaines personnalisés et préfixes. Cependant, un domaine de préfixe n'est pas entièrement fonctionnel lorsque vous avez également un domaine personnalisé : les points de terminaison de découverte `.well-known` OIDC *ne* présentent que des chemins de domaine personnalisés. Vous ne pouvez utiliser le domaine de préfixe que pour les opérations qui ne nécessitent pas de découverte de point de terminaison (`openid-configuration`) dans un groupe d'utilisateurs avec cette configuration. En raison de ces propriétés des groupes d'utilisateurs, vous pouvez choisir efficacement une version de marque par groupe d'utilisateurs.

Vous pouvez attribuer des styles aux clients de l'application dans un groupe d'utilisateurs dans lequel un domaine est défini sur la version de marque de connexion gérée. Les styles sont un ensemble de paramètres visuels composés de fichiers image, d'options d'affichage et de valeurs CSS. Lorsque vous attribuez un style à un client d'application, Amazon Cognito envoie immédiatement vos mises à jour sur vos pages de connexion interactives. Amazon Cognito affiche vos pages interactives avec la version de marque que vous avez choisie et la personnalisation que vous y avez appliquée.

### Mettre à jour et supprimer des styles
<a name="managed-login-branding-update"></a>

Lorsque vous créez un style, vous le liez à un client d'application. Pour modifier une attribution de style pour un client d'application, vous devez d'abord supprimer le style d'origine. Actuellement, vous ne pouvez pas copier les paramètres entre les styles. Vous devez le faire par programmation. Pour répliquer les paramètres entre les styles et les clients d'applications, obtenez les paramètres d'un style avec l'opération d'[DescribeManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeManagedLoginBranding.html)API et appliquez-les avec [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)ou [UpdateManagedLoginBranding](https://docs.aws.amazon.com/). Vous ne pouvez pas modifier les styles attribués à un client d'application. Vous pouvez uniquement supprimer l'original et en définir un nouveau. Pour plus d'informations sur la gestion des styles avec les opérations d'API et de SDK, consultez[Opérations d'API et de SDK pour la gestion de l'image de marque des connexions](managed-login-brandingeditor.md#branding-designer-api).

**Note**  
Les demandes programmatiques qui créent ou mettent à jour un style de marque ne doivent pas avoir une taille de demande supérieure à 2 Mo. Si votre demande dépasse cette limite, divisez-la en plusieurs `UpdateManagedLoginBranding` demandes pour des groupes de paramètres ne dépassant pas la taille maximale de la demande. Ces demandes n'entraînent pas la définition par défaut de paramètres non spécifiés. Vous pouvez donc envoyer des demandes partielles sans aucun effet sur les paramètres existants.

Vous supprimez un style dans la console Amazon Cognito depuis le menu de **connexion géré**. Sous **Styles**, choisissez le style que vous souhaitez supprimer, puis sélectionnez **Supprimer le style**.

À un niveau élevé, le processus d'attribution d'une image de marque à un domaine comprend les étapes suivantes.

1. [Créez un domaine et définissez la version de marque](cognito-user-pools-assign-domain.md).

1. Créez un style de marque et attribuez-le à un client d'application.

**Pour attribuer un style à un client d'application**

1. Dans le menu **Domaine** de votre groupe d'utilisateurs, créez un domaine et définissez la **version Branding** sur **Connexion gérée**.

1. Accédez au menu **Connexion gérée**. Sous **Styles**, choisissez **Créer un style**.

1. [Choisissez le client d'application auquel vous souhaitez attribuer votre style ou créez-en un nouveau.](user-pool-settings-client-apps.md)

1. Pour commencer à configurer vos paramètres de marque, choisissez **Lancer l'éditeur de marque**.

**Topics**
+ [Choisissez une expérience de marque et attribuez des styles](#managed-login-branding-choose)
+ [L'éditeur de marque et la personnalisation de la connexion gérée](managed-login-brandingeditor.md)
+ [Personnalisation de l'image de marque (classique) de l'interface utilisateur hébergée](hosted-ui-classic-branding.md)

# L'éditeur de marque et la personnalisation de la connexion gérée
<a name="managed-login-brandingeditor"></a>

L'éditeur de marque est un outil de conception visuelle et d'édition pour vos pages Web de connexion gérées. Il est intégré à la console Amazon Cognito. Dans l'éditeur de marque, vous commencez par un aperçu de vos pages de connexion, puis vous pouvez passer à une option de configuration rapide ou à une vue détaillée avec des options avancées. Vous pouvez modifier et prévisualiser les paramètres de style ou ajouter une image d'arrière-plan et un logo personnalisés. Vous pouvez configurer le mode clair et le mode sombre.

![\[Aperçu de l'éditeur visuel de marque pour les groupes d'utilisateurs d'Amazon Cognito.\]](http://docs.aws.amazon.com/fr_fr/cognito/latest/developerguide/images/hosted-ui-customization-editor-preview.png)


Pour commencer, créez un style que vous pouvez appliquer à votre groupe d'utilisateurs ou à un client d'application.

**Pour démarrer avec l'éditeur de marque**

1. [Créez un domaine](cognito-user-pools-assign-domain.md) depuis l'onglet **Domaine** ou mettez à jour votre domaine existant. Sous **Version de marque**, configurez votre domaine pour qu'il utilise la **connexion gérée**.

1. Supprimez le style de client d'application existant, le cas échéant.

   1. Dans le menu **Clients de l'application**, sélectionnez votre client d'application.

   1. Sous **Style de connexion géré**, sélectionnez le style attribué à votre client d'application.

   1. Choisissez **Supprimer le style**. Confirmez votre sélection.

1. Accédez au menu **Connexion gérée** dans votre groupe d'utilisateurs. Si ce n'est pas déjà fait, suivez les instructions pour sélectionner un [plan de fonctionnalités](cognito-sign-in-feature-plans.md) incluant une connexion gérée. Vous pouvez également sélectionner **Aperçu de cette fonctionnalité** si vous souhaitez consulter l'éditeur de marque sans apporter de modifications.

1. Sous **Styles**, choisissez **Créer un style**.

1. Choisissez le client d'application auquel vous souhaitez attribuer votre style et sélectionnez **Créer**. Vous pouvez également créer un nouveau client d'application.

1. La console Amazon Cognito lance l'éditeur de marque.

1. Choisissez un onglet dans lequel vous souhaitez commencer à modifier, ou sélectionnez **Lancer l'éditeur** et entrez dans la [configuration rapide](#branding-designer-quick-setup). Les onglets suivants sont disponibles :  
**Version préliminaire**  
Découvrez à quoi ressemblent vos sélections actuelles sur vos pages de connexion gérées.  
**Principe de base**  
Définissez un thème général, configurez les liens vers les fournisseurs d'identité externes et personnalisez les champs de formulaire.  
**Éléments**  
Configurez les styles pour les en-têtes, les pieds de page et les éléments individuels de l'interface utilisateur.

1. Pour effectuer des choix concernant les paramètres initiaux, accédez à la configuration rapide. Sélectionnez **Modifier la catégorie des paramètres**, puis **Configuration rapide**. Lorsque vous sélectionnez **Continuer**, l'éditeur de marque démarre avec un ensemble d'options de base que vous pouvez configurer.

## Texte et localisation
<a name="branding-designer-loc"></a>

Vous ne pouvez pas modifier ou localiser le texte dans l'éditeur de marque. Ajoutez plutôt un paramètre de `lang` requête à l'URL que vous distribuez aux utilisateurs. Ce paramètre permet de localiser vos pages de connexion gérées dans l'une des nombreuses langues disponibles. Pour de plus amples informations, veuillez consulter [Localisation des connexions gérées](cognito-user-pools-managed-login.md#managed-login-localization). 

## Configuration rapide
<a name="branding-designer-quick-setup"></a>

Le bouton **Lancer l'éditeur de marque** charge un éditeur visuel pour votre configuration de connexion gérée, dans lequel vous pouvez choisir parmi une variété d'options de personnalisation principales. Au fur et à mesure que vous effectuez des sélections, Amazon Cognito affiche vos modifications de connexion gérées dans une fenêtre d'aperçu. Pour revenir au menu détaillé des paramètres, cliquez sur le bouton **Modifier la catégorie des paramètres**.

**Quels devraient être l'aspect général ?**  
Configurez les paramètres de base du thème pour la connexion gérée.    
**Mode d'affichage**  
Choisissez un mode clair, un mode sombre ou une expérience adaptative pour votre connexion gérée. Les paramètres adaptatifs dépendent des préférences du navigateur de l'utilisateur lorsqu'Amazon Cognito affiche la connexion gérée. Lorsque vous choisissez un mode adapté au navigateur, vous pouvez choisir différentes couleurs et images de logo pour le mode clair et le mode foncé.  
**Spacing**  
Définissez l'espacement par défaut entre les éléments de la page.  
**Rayon de bordure**  
Définissez la profondeur d'arrondissement de la bordure extérieure des éléments.

**À quoi doit ressembler l'arrière-plan de la page ?**    
**Type d'arrière-plan**  
La case à cocher **Afficher l'image** indique si vous souhaitez une image d'arrière-plan ou si vous souhaitez définir une couleur d'arrière-plan unie.  

1. Pour utiliser une image, sélectionnez **Afficher l'image** et choisissez une image d'arrière-plan pour les modes clair et foncé. Vous pouvez également définir une **couleur d'arrière-plan de page** en mode sombre et en mode clair pour les zones de l'arrière-plan qui ne sont pas couvertes par l'image.

1. **Pour n'utiliser qu'une couleur pour l'arrière-plan, désélectionnez **Afficher l'image** et choisissez une couleur d'arrière-plan de page en mode clair et en mode sombre.**

**À quoi devraient ressembler les formulaires ?**  
Configurez les paramètres des éléments de formulaire de connexion gérée. Les instructions de connexion et de code sont des exemples d'éléments de formulaire.    
**Alignement horizontal**  
Définissez l'alignement horizontal des champs de formulaire.  
**Logo du formulaire**  
Définissez le positionnement de l'image de votre logo.  
**Image du logo**  
Choisissez un fichier image de logo à inclure dans l'élément de formulaire pour les modes clair et foncé. Pour télécharger une image, sélectionnez le menu déroulant **Image du logo**, choisissez **Ajouter une nouvelle ressource** et ajoutez un fichier de logo.  
**Couleur de marque principale**  
Définissez une couleur de thème pour les modes clair et foncé. Cette couleur sera appliquée comme couleur d'arrière-plan à tous les éléments classés comme principaux.

**À quoi devraient ressembler les en-têtes ?**  
Choisissez si vous souhaitez inclure un en-tête dans vos pages de connexion gérées. L'en-tête peut contenir une image de logo.    
**Logo d'en-tête**  
Définissez la position de l'image du logo dans votre en-tête.  
**Image du logo**  
Choisissez la position du logo et le fichier image du logo à inclure dans l'en-tête. Pour télécharger une image, sélectionnez le menu déroulant **Image du logo**, choisissez **Ajouter une nouvelle ressource** et ajoutez un fichier de logo.  
**Couleur d’arrière-plan de l’en-tête**  
Définissez les couleurs des modes clair et foncé pour l'arrière-plan de l'en-tête.

## Réglages détaillés
<a name="branding-designer-advanced"></a>

Dans la vue des paramètres détaillés, vous pouvez modifier des composants individuels dans **Foundation** et **Components**. L'onglet **Aperçu** affiche un aperçu de la connexion gérée dans le contexte actuel avec vos personnalisations.

![\[AWS Management Console Capture d'écran de la configuration détaillée des composants de connexion gérés.\]](http://docs.aws.amazon.com/fr_fr/cognito/latest/developerguide/images/hosted-ui-customization-console-preview.png)


Pour accéder à l'éditeur visuel d'un composant, cliquez sur l'icône d'édition dans la vignette du composant. Dans l'éditeur du studio de thème, vous pouvez passer d'un composant à l'autre à l'aide du bouton **Modifier la catégorie de paramètres**.

### Principe de base
<a name="branding-designer-advanced-foundation"></a>

**Style d'application**  
Configurez les bases de votre configuration de connexion gérée. Cette catégorie contient des paramètres pour le thème général, l'espacement du texte, ainsi que l'en-tête et le pied de page.

**Mode d'affichage**  
Choisissez un mode clair, un mode sombre ou une expérience adaptative pour vos pages de connexion gérées. Lorsque vous choisissez un mode adapté au navigateur, vous pouvez choisir différentes couleurs et images de logo pour le mode clair et le mode foncé.

**Spacing**  
Définissez l'espacement par défaut entre les éléments de la page.

**Comportement d'authentification**  
Configurez les styles des boutons qui connectent vos utilisateurs à des fournisseurs d'identité externes (IdPs). Cette section inclut l'option de **recherche par domaine qui permet aux utilisateurs de se connecter d'inviter les utilisateurs à saisir** une adresse e-mail et de les associer à l'[identifiant de leur fournisseur d'identité SAML](cognito-user-pools-managing-saml-idp-naming.md).

**Comportement du formulaire**  
Configurez les styles des formulaires de saisie : positionnement des entrées, couleurs et alignement des éléments.

### Éléments
<a name="branding-designer-advanced-components"></a>

**Boutons**  
Styles pour les boutons affichés par Amazon Cognito sur les pages de connexion gérées.

**Diviseur**  
Styles pour les lignes de séparation et les limites entre les éléments de connexion gérés tels que le formulaire de saisie et le sélecteur de connexion du fournisseur externe.

**Liste déroulante**  
Styles pour les menus déroulants.

**Favicon**  
Styles pour l'image fournie par Amazon Cognito pour l'icône en forme d'onglet et de signet.

**Bagues Focus**  
Styles pour les surlignages qui indiquent une entrée actuellement sélectionnée.

**Conteneur de formulaires**  
Styles pour les éléments qui délimitent un formulaire.

**Pied de page global**  
Styles pour le pied de page qu'Amazon Cognito affiche en bas des pages de connexion gérées.

**En-tête global**  
Styles pour l'en-tête affiché par Amazon Cognito en haut des pages de connexion gérées.

**Indications**  
Styles pour les messages d'erreur et de réussite.

**Contrôles d'options**  
Styles pour les cases à cocher, les sélections multiples et les autres invites de saisie.

**Fond de page**  
Styles pour l'arrière-plan général de la connexion gérée.

**Inputs**  
Styles pour les invites de saisie dans les champs de formulaire.

**Lien**  
Styles pour les hyperliens dans les pages de connexion gérées.

**Texte pour page**  
Styles pour le texte intégré à la page.

**Texte pour le champ**  
Styles pour le texte qui entoure les entrées de formulaire.

## Opérations d'API et de SDK pour la gestion de l'image de marque des connexions
<a name="branding-designer-api"></a>

Vous pouvez également appliquer une image de marque à un style de connexion géré à l'aide des opérations d'API [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)et [UpdateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_UpdateManagedLoginBranding.html). Ces opérations sont idéales pour créer des versions identiques ou légèrement modifiées d'un style de marque pour un autre client d'application ou un autre groupe d'utilisateurs. Interrogez la marque de connexion gérée d'un style existant à l'aide de l'opération API [DescribeManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeManagedLoginBranding.html), puis modifiez le résultat selon vos besoins et appliquez-le à une autre ressource.

L'`UpdateManagedLoginBranding`opération ne modifie pas le client d'application auquel votre style est appliqué. Il met uniquement à jour le style existant attribué à un client d'application. Pour remplacer complètement le style d'un client d'application, supprimez le style existant par [DeleteManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DeleteManagedLoginBranding.html)et attribuez-lui un nouveau style par`CreateManagedLoginBranding`. Dans la console Amazon Cognito, il en va de même : vous devez supprimer le style existant et en créer un nouveau.

La configuration de la marque de connexion gérée dans une demande d'API ou de SDK nécessite que vos paramètres soient intégrés dans un fichier JSON converti en type de `Document` données. Vous trouverez ci-dessous des instructions relatives aux images que vous pouvez ajouter et à la génération de demandes programmatiques pour configurer un style de marque.

### Ressources liées à l'image
<a name="branding-designer-api-assets"></a>

[CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)et [UpdateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_UpdateManagedLoginBranding.html)incluez un `Assets` paramètre. Ce paramètre est un tableau de fichiers image au format binaire codé en base64.

**Note**  
Les demandes programmatiques qui créent ou mettent à jour un style de marque ne doivent pas avoir une taille de demande supérieure à 2 Mo. Les actifs de votre demande peuvent l'amener à dépasser cette limite. Si tel est le cas, divisez votre demande en plusieurs `UpdateManagedLoginBranding` demandes pour des groupes de paramètres ne dépassant pas la taille maximale de la demande. Ces demandes n'entraînent pas la définition par défaut de paramètres non spécifiés. Vous pouvez donc envoyer des demandes partielles sans aucun effet sur les paramètres existants.

Les types de fichiers que vous pouvez soumettre sont limités pour certains actifs.


****  

| Ressource | Extensions de fichiers acceptées | 
| --- | --- | 
| FAVICON\$1ICO | ico | 
| FAVICON\$1SVG | svg | 
| EMAIL\$1GRAPHIC | png, svg, jpeg | 
| SMS\$1GRAPHIC | png, svg, jpeg | 
| AUTH\$1APP\$1GRAPHIC | png, svg, jpeg | 
| GRAPHIQUE DU MOT DE PASSE | png, svg, jpeg | 
| PASSKEY\$1GRAPHIC | png, svg, jpeg | 
| LOGO D'EN-TÊTE DE PAGE | png, svg, jpeg | 
| FOND D'ENTÊTE DE PAGE | png, svg, jpeg | 
| LOGO DE PIED DE PAGE | png, svg, jpeg | 
| ARRIÈRE-PLAN DU PIED DE PAGE | png, svg, jpeg | 
| ARRIÈRE-PLAN DE PAGE | png, svg, jpeg | 
| ARRIÈRE-PLAN DU FORMULAIRE | png, svg, jpeg | 
| LOGO\$1FORMULAIRE | png, svg, jpeg | 
| IDP\$1BUTTON\$1ICON | ico, svg | 

Les fichiers de type SVG prennent en charge les attributs et éléments suivants.

------
#### [ Attributes ]

```
accent-height, accumulate, additivive, alignment-baseline, ascent, attributename, attributetype, azimuth, basefrequency, baseline-shift, begin, bias, by, class, clip, clip-path, clip-rule, color, color-interpolation, color-interpolation-filters, color-profile, color-rendering, cx, cy, d, dx, dy, diffuseconstant, direction, display, divisor, dur, edgemode, elevation, end, fill, fill-opacity, fill-rule, filter, filterunits, flood-color, flood-opacity, font-family, font-size, font-size-adjust, font-stretch, font-style, font-variant, font-weight, fx, fy, g1, g2, glyph-name, glyphref, gradientunits, gradienttransform, height, href, id, image-rendering, in, in2, k, k1, k2, k3, k4, kerning, keypoints, keysplines, keytimes, lang, lengthadjust, letter-spacing, kernelmatrix, kernelunitlength, lighting-color, local, marker-end, marker-mid, marker-start, markerheight, markerunits, markerwidth, maskcontentunits, maskunits, max, mask, media, method, mode, min, name, numoctaves, offset, operator, opacity, order, orient, orientation, origin, overflow, paint-order, path, pathlength, patterncontentunits, patterntransform, patternunits, points, preservealpha, preserveaspectratio, r, rx, ry, radius, refx, refy, repeatcount, repeatdur, restart, result, rotate, scale, seed, shape-rendering, specularconstant, specularexponent, spreadmethod, stddeviation, stitchtiles, stop-color, stop-opacity, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke, stroke-width, style, surfacescale, tabindex, targetx, targety, transform, text-anchor, text-decoration, text-rendering, textlength, type, u1, u2, unicode, values, viewbox, visibility, vert-adv-y, vert-origin-x, vert-origin-y, width, word-spacing, wrap, writing-mode, xchannelselector, ychannelselector, x, x1, x2, xmlns, y, y1, y2, z, zoomandpan
```

------
#### [ Elements ]

```
svg, a, altglyph, altglyphdef, altglyphitem, animatecolor, animatemotion, animatetransform, audio, canvas, circle, clippath, defs, desc, ellipse, filter, font, g, glyph, glyphref, hkern, image, line, lineargradient, marker, mask, metadata, mpath, path, pattern, polygon, polyline, radialgradient, rect, stop, style, switch, symbol, text, textpath, title, tref, tspan, video, view, vkern, feBlend, feColorMatrix, feComponentTransfer, feComposite, feConvolveMatrix, feDiffuseLighting, feDisplacementMap, feDistantLight, feFlood, feFuncA, feFuncB, feFuncG, feFuncR, feGaussianBlur, feMerge, feMergeNode, feMorphology, feOffset, fePointLight, feSpecularLighting, feSpotLight, feTile, feTurbulence
```

------

### Outils pour gérer les opérations de connexion et de marque
<a name="branding-designer-api-tools"></a>

Amazon Cognito gère un fichier au [format JSON pour l'objet des paramètres de marque](https://json-schema.org/docs) de connexion gérés. Voici comment mettre à jour votre style de marque par programmation.

**Pour mettre à jour l'image de marque dans l'API des groupes d'utilisateurs**

1. Dans la console Amazon Cognito, créez un style de marque de connexion géré par défaut à partir du menu **Connexion gérée** de votre groupe d'utilisateurs. Attribuez-le à un client d'application.

1. Enregistrez l'ID du client d'application pour lequel vous avez créé le style, par exemple`1example23456789`.

1. Récupérez les paramètres du style de marque à l'aide d'une requête d'[DescribeManagedLoginBrandingByClient](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeManagedLoginBrandingByClient.html)API `ReturnMergedResources` définie sur`true`. Voici un exemple de corps de demande.

   ```
   {
      "ClientId": "1example23456789",
      "ReturnMergedResources": true,
      "UserPoolId": "us-east-1_EXAMPLE"
   }
   ```

1. Modifiez le résultat de `DescribeManagedLoginBrandingByClient` avec vos personnalisations.

   1. Le corps de la réponse est enveloppé dans un `ManagedLoginBranding` élément qui ne fait pas partie de la syntaxe des opérations de création et de mise à jour. Supprimez ce niveau supérieur de l'objet JSON.

   1. Pour remplacer des images, remplacez la `Bytes` valeur par les données binaires codées en Base64 de chaque fichier image.

   1. Pour mettre à jour les paramètres, modifiez le résultat de l'`Settings`objet et incluez-le dans votre prochaine demande. Amazon Cognito ignore les valeurs de votre `Settings` objet qui ne figurent pas dans le schéma que vous recevez dans votre réponse d'API.

1. Utilisez le corps de réponse mis à jour dans une [UpdateManagedLoginBranding](https://docs.aws.amazon.com/)demande [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)or. Si la taille de cette demande dépasse 2 Mo, séparez-la en plusieurs demandes. Ces opérations fonctionnent dans un `PATCH` modèle où les paramètres d'origine restent inchangés, sauf indication contraire de votre part.

# Personnalisation de l'image de marque (classique) de l'interface utilisateur hébergée
<a name="hosted-ui-classic-branding"></a>

Vous pouvez utiliser l' AWS Management Console API ou ou pour définir les AWS CLI paramètres de personnalisation classiques de l'interface utilisateur hébergée. Vous pouvez télécharger une image de logo personnalisé à afficher dans l'application. Vous pouvez également appliquer certaines options de feuilles de style en cascade (CSS) à l'apparence de l'interface utilisateur.

Vous pouvez personnaliser les paramètres par défaut de l'interface utilisateur et remplacer les [clients d'applications](cognito-terms.md#term-appclient) individuels par des paramètres spécifiques. Amazon Cognito applique la configuration par défaut à chaque client d'application qui ne possède pas de paramètres au niveau du client.

Dans la console Amazon Cognito et dans les demandes d'API, la demande qui définit la personnalisation de votre interface utilisateur ne doit pas dépasser 135 Ko. Dans de rares cas, la somme des en-têtes de la demande, de votre fichier CSS et de votre logo peut dépasser 135 Ko. Amazon Cognito code le fichier image en Base64. Cela augmente la taille d'une image de 100 Ko à 130 Ko, ce qui laisse 5 Ko pour les en-têtes de demande et votre fichier CSS. Si la demande est trop importante, la AWS Management Console ou votre demande `SetUICustomization` d'API renvoie une `request parameters too large` erreur. Faites en sorte que l'image de votre logo ne dépasse pas 100 Ko et que votre fichier CSS ne dépasse pas 3 Ko. Vous ne pouvez pas définir la personnalisation du CSS et du logo séparément.

**Note**  
Pour personnaliser votre IU, vous devez configurer un domaine pour votre groupe d'utilisateurs.

## Spécification d'un logo personnalisé dans le cadre d'une stratégie de marque classique
<a name="cognito-user-pools-app-ui-customization-logo"></a>

Amazon Cognito centre votre logo personnalisé au-dessus des champs de saisie du [Point de terminaison de connexion](login-endpoint.md).

Choisissez un fichier PNG, JPG ou JPEG qui puisse être redimensionné à 350 x 178 pixels pour le logo personnalisé de votre interface utilisateur hébergée. La taille de votre fichier de logo ne doit pas dépasser 100 Ko, ou 130 Ko une fois qu'Amazon Cognito l'a codé au format Base64. Pour définir un `ImageFile` in [https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html)dans l'API, convertissez votre fichier en une chaîne de texte codée en Base64 ou, dans le AWS CLI, indiquez un chemin de fichier et laissez Amazon Cognito l'encoder pour vous.

## Spécifier les personnalisations CSS dans le cadre d'une stratégie de marque classique
<a name="cognito-user-pools-app-ui-customization-css"></a>

Vous pouvez personnaliser le CSS pour les pages d'application hébergée, avec les restrictions suivantes :
+ Vous pouvez utiliser l'un des noms de classe CSS suivants :
  + `background-customizable`
  + `banner-customizable`
  + `errorMessage-customizable`
  + `idpButton-customizable`
  + `idpButton-customizable:hover`
  + `idpDescription-customizable`
  + `inputField-customizable`
  + `inputField-customizable:focus`
  + `label-customizable`
  + `legalText-customizable`
  + `logo-customizable`
  + `passwordCheck-valid-customizable`
  + `passwordCheck-notValid-customizable`
  + `redirect-customizable`
  + `socialButton-customizable`
  + `submitButton-customizable`
  + `submitButton-customizable:hover`
  + `textDescription-customizable`
+ Les valeurs de propriétés peuvent contenir du code HTML, à l'exception des valeurs suivantes : `@import`,`@supports`,`@page`, ou `@media` ou Javascript.

Vous pouvez personnaliser les propriétés CSS suivantes.

**Étiquettes**  
+ **épaisseur de police** est un multiple de 100, de 100 à 900.
+ **couleur** est la couleur du texte. Il doit s'agir d'une [valeur de couleur CSS légale](https://www.w3schools.com/cssref/css_colors_legal.php).

**Champs de saisie**  
+ **largeur** représente la largeur du bloc contenant en pourcentage.
+ **hauteur** est la hauteur du champ d'entrée en pixels (px).
+ **couleur** est la couleur du texte. Il peut s'agir de toute valeur de couleur CSS standard.
+ **couleur d'arrière-plan** est la couleur d'arrière-plan du champ d'entrée. Il peut s'agir de toute valeur de couleur CSS standard.
+ **bordure** est une valeur de bordure CSS standard qui spécifie la largeur, la transparence et la couleur de la bordure de la fenêtre de votre application. La valeur de la largeur peut être comprise entre 1px et 100px. La transparence peut être solide ou inexistante. La couleur peut être toute valeur de couleur standard.

**Descriptions texte**  
+ **marge supérieure** est la quantité de remplissage au-dessus de la description du texte.
+ **marge inférieure** est la quantité de remplissage au-dessous de la description du texte.
+ **affichage** peut être `block` ou `inline`.
+ **taille de police** est la taille de la police pour les descriptions de texte.
+ **couleur** est la couleur du texte. Il doit s'agir d'une [valeur de couleur CSS légale](https://www.w3schools.com/cssref/css_colors_legal.php).

**Bouton de soumission**  
+ **taille de police** est la taille de la police pour le texte du bouton.
+ **épaisseur de la police** est l'épaisseur de la police du texte du bouton : `bold`, `italic` ou `normal`.
+ **marge** est une chaîne de 4 valeurs indiquant la taille des marges en haut, à droite, en bas et à gauche pour le bouton.
+ **taille de police** est la taille de la police pour les descriptions de texte.
+ **largeur** est la largeur du bouton en pourcentage du texte du bloc contenant.
+ **hauteur** est la hauteur du bouton en pixels (px).
+ **couleur** est la couleur du texte du bouton. Il peut s'agir de toute valeur de couleur CSS standard.
+ **couleur d'arrière-plan** est la couleur d'arrière-plan du bouton. Il peut s'agir de toute valeur de couleur standard.

**Bannière**  
+ **remplissage** est une chaîne de 4 valeurs indiquant la taille du remplissage en haut, à droite, en bas et à gauche pour la bannière.
+ **couleur d'arrière-plan** est la couleur d'arrière-plan de la bannière. Il peut s'agir de toute valeur de couleur CSS standard.

**Info-bulle de bouton de soumission**  
+ **couleur** est la couleur de premier plan du bouton lorsque vous le survolez. Il peut s'agir de toute valeur de couleur CSS standard.
+ **couleur d'arrière-plan** est la couleur d'arrière-plan du bouton lorsque vous le survolez. Il peut s'agir de toute valeur de couleur CSS standard.

**Info-bulle de bouton de fournisseur d'identité**  
+ **couleur** est la couleur de premier plan du bouton lorsque vous le survolez. Il peut s'agir de toute valeur de couleur CSS standard.
+ **couleur d'arrière-plan** est la couleur d'arrière-plan du bouton lorsque vous le survolez. Il peut s'agir de toute valeur de couleur CSS standard.

**Vérification de mot de passe non valide**  
+ **couleur** est la couleur du texte du message `"Password check not valid"`. Il peut s'agir de toute valeur de couleur CSS standard.

**Contexte**  
+ **couleur d'arrière-plan** est la couleur d'arrière-plan de la fenêtre de l'application. Il peut s'agir de toute valeur de couleur CSS standard.

**Messages d'erreur**  
+ **marge** est une chaîne de 4 valeurs indiquant la taille des marges en haut, à droite, en bas et à gauche.
+ **remplissage** est la taille de remplissage.
+ **taille de police** est la taille de la police.
+ **largeur** est la largeur du message d'erreur sous forme de pourcentage du bloc contenant.
+ **arrière-plan** est la couleur d'arrière-plan du message d'erreur. Il peut s'agir de toute valeur de couleur CSS standard.
+ **bordure** est une chaîne de 3 valeurs spécifiant la largeur, la transparence et la couleur de la bordure.
+ **couleur** est la couleur du texte du message. Il peut s'agir de toute valeur de couleur CSS standard.
+ **Dimension de la boîte** est utilisé pour indiquer au navigateur les propriétés de dimensions (largeur et hauteur).

**Boutons de fournisseur d'identité**  
+ **hauteur** est la hauteur du bouton en pixels (px).
+ **largeur** est la largeur du texte du bouton sous forme de pourcentage du bloc contenant. 
+ **alignement du texte** est le paramètre d'alignement du texte. Il peut être `left`, `right` ou `center`.
+ **marge inférieure** est le paramètre de la marge inférieure. 
+ **couleur** est la couleur du texte du bouton. Il peut s'agir de toute valeur de couleur CSS standard.
+ **couleur d'arrière-plan** est la couleur d'arrière-plan du bouton. Il peut s'agir de toute valeur de couleur CSS standard.
+ **couleur de bordure** est la couleur de la bordure du bouton. Il peut s'agir de toute valeur de couleur CSS standard.

**Descriptions de fournisseur d'identité**  
+ **marge supérieure** est la quantité de remplissage au-dessus de la description.
+ **marge inférieure** est la quantité de remplissage au-dessous de la description.
+ **affichage** peut être `block` ou `inline`.
+ **taille de police** est la taille de la police pour les descriptions.
+ **color** est la couleur du texte pour les en-têtes des sections IdP, par exemple, **connectez-vous avec votre** identifiant d'entreprise. Il doit s'agir d'une [valeur de couleur CSS légale](https://www.w3schools.com/cssref/css_colors_legal.php).

**Texte légal**  
+ **couleur** est la couleur du texte. Il peut s'agir de toute valeur de couleur CSS standard.
+ **taille de police** est la taille de la police.
Lorsque vous personnalisez le **Texte juridique**, vous personnalisez la messagerie. **Nous ne publierons aucun de vos comptes sans demander au préalable** ce qui s'affiche sous les fournisseurs d'identité sociale sur la page de connexion.

**Logo**  
+ **largeur max** est la largeur maximum sous forme de pourcentage du bloc contenant.
+ **hauteur max** est la hauteur maximum sous forme de pourcentage du bloc contenant.
+ **la** couleur d'arrière-plan est la couleur de fond des bûches dont les sections sont transparentes. Il doit s'agir d'une [valeur de couleur CSS légale](https://www.w3schools.com/cssref/css_colors_legal.php).

**Focus sur le champ de saisie**  
+ **couleur de bordure** est la couleur du champ de saisie. Il peut s'agir de toute valeur de couleur CSS standard.
+ **contour** est la largeur de la bordure du champ de saisie en pixels (px).

**Bouton de réseaux sociaux**  
+ **hauteur** est la hauteur du bouton en pixels (px).
+ **alignement du texte** est le paramètre d'alignement du texte. Il peut être `left`, `right` ou `center`.
+ **largeur** est la largeur du texte du bouton sous forme de pourcentage du bloc contenant.
+ **marge inférieure** est le paramètre de la marge inférieure.

**Vérification de mot de passe valide**  
+ **couleur** est la couleur du texte du message `"Password check valid"`. Il peut s'agir de toute valeur de couleur CSS standard.

## Personnalisation de l'interface utilisateur hébergée avec une image de marque classique dans AWS Management Console
<a name="cognito-user-pools-app-ui-customization-console"></a>

Vous pouvez utiliser le AWS Management Console pour définir les paramètres de personnalisation de l'interface utilisateur de votre application.

**Note**  
Vous pouvez afficher l'IU hébergée avec vos personnalisations en construisant l'URL suivante avec les spécificités de votre groupe d'utilisateurs, puis en la tapant dans votre navigateur : ` https://<your_domain>/login?response_type=code&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>` Une minute d'attente sera probablement nécessaire pour actualiser votre navigateur avant que les modifications appliquées à votre console n'apparaissent.  
Votre domaine est affiché sur le site **Intégration d'applications** onglet sous **Domaine**. Votre ID de client d'application et votre URL de rappel s'affichent dans l'onglet **Clients d'application**.

**Pour spécifier les paramètres de personnalisation de l'interface utilisateur de l'application**

1. Connectez-vous à la [console Amazon Cognito](https://console.aws.amazon.com/cognito/home).

1. Dans le volet de navigation, choisissez **Groupes d'utilisateurs**, puis choisissez le groupe d'utilisateurs que vous souhaitez modifier.

1. [Créez un domaine](cognito-user-pools-assign-domain.md) depuis l'onglet **Domaine** ou mettez à jour votre domaine existant. Sous **Version de marque**, configurez votre domaine pour qu'il utilise l'**interface utilisateur hébergée (classique)**.

1. Choisissez le menu **Connexion gérée**.

1. Pour personnaliser les paramètres de l'interface utilisateur pour tous les clients de l'application, recherchez **Style** sous **Paramètres de l'interface utilisateur hébergée** et sélectionnez **Modifier**.

1. Pour personnaliser les paramètres de l'interface utilisateur pour un client d'application, accédez au menu **Clients de l'application** et sélectionnez le client d'application que vous souhaitez modifier, puis recherchez le **style d'interface utilisateur hébergée (classique)** et sélectionnez **Remplacer**. Tâche de sélection **Modifier**.

1. Pour télécharger votre propre fichier image de logo, choisissez **Choisir un fichier** ou **Remplacer le fichier actuel**.

1. Pour personnaliser le fichier CSS d'interface utilisateur hébergée, téléchargez **CSS template.css** et modifiez le modèle avec les valeurs que vous souhaitez personnaliser. Seules les clés incluses dans le modèle peuvent être utilisées avec l'interface utilisateur hébergée. Les clés CSS ajoutées ne seront pas reflétées dans votre interface utilisateur. Après avoir personnalisé le fichier CSS, choisissez **Choisir un fichier** ou **Remplacer le fichier actuel** pour télécharger votre fichier CSS personnalisé.

## Personnalisation de l'interface utilisateur hébergée avec une image de marque classique dans l'API des groupes d'utilisateurs et avec AWS CLI
<a name="cognito-user-pools-app-ui-customization-cli-api"></a>

Utilisez les commandes suivantes pour spécifier les paramètres de personnalisation de l'IU pour votre groupe d'utilisateurs.

**Pour obtenir les paramètres de personnalisation de l'IU de l'application intégrée d'un groupe d'utilisateurs, utilisez les opérations d'API suivantes.**
+ AWS CLI: `aws cognito-idp get-ui-customization`
+ AWS API : [https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_GetUICustomization.html](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_GetUICustomization.html)

**Pour définir les paramètres de personnalisation de l'IU de l'application intégrée d'un groupe d'utilisateurs, utilisez les opérations d'API suivantes.**
+ AWS CLI depuis un fichier image : `aws cognito-idp set-ui-customization --user-pool-id <your-user-pool-id> --client-id <your-app-client-id> --image-file fileb://"<path-to-logo-image-file>" --css ".label-customizable{ color: <color>;}"`
+ AWS CLI avec image codée sous forme de texte binaire Base64 : `aws cognito-idp set-ui-customization --user-pool-id <your-user-pool-id> --client-id <your-app-client-id> --image-file <base64-encoded-image-file> --css ".label-customizable{ color: <color>;}"`
+ AWS API : [https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html)