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

> Décrit comment mettre en œuvre l’authentification sans mot de passe avec connexion intégrée dans les SPA.

# Authentification sans mot de passe avec connexion intégrée pour les SPA

export const ReleaseStageNotice = ({feature, stage, plans, contact, terms}) => {
  const stageTextMap = {
    "beta": "bêta",
    "ea": "Accès anticipé"
  };
  const stageText = stageTextMap[stage] || "une phase de lancement du produit";
  const prsLink = "/docs/troubleshoot/product-lifecycle/product-release-stages";
  const linkify = (text, url) => {
    return <a href={url} target="_blank" rel="noreferrer" class="link">{text}</a>;
  };
  const includeDetails = (plans, contact, terms) => {
    const hasDetails = terms || plans || contact;
    if (!hasDetails) return null;
    return <span data-as="p">
            {plans && <>Cette fonctionnalité est offerte avec les forfaits {linkify(`${plans}`, "https://auth0.com/pricing")}. </>}
            {contact && "Pour y participer, communiquez avec " + contact + ". "}
            {terms && <>En utilisant cette fonctionnalité, vous acceptez les conditions applicables de l’essai gratuit énoncées dans le {linkify("Master Subscription Agreement", "https://www.okta.com/legal")} d’Okta.</>}
        </span>;
  };
  return <Warning>
            <span data-as="p">
                <strong>La fonctionnalité {feature} est en {linkify(stageText, prsLink)}.</strong>
            </span>

            {includeDetails(plans, contact, terms)}
        </Warning>;
};

<Warning>
  La connexion intégrée pour les applications Web utilise l’[authentification inter-origines](/docs/fr-ca/authenticate/login/cross-origin-authentication), sauf si vous [configurez un domaine personnalisé](/docs/fr-ca/customize/custom-domains) pour votre tenant. L’authentification inter-origines repose sur des cookies tiers pour permettre des transactions d’authentification sécurisées entre différentes origines.
</Warning>

<div id="using-auth0s-sdks-to-implement-embedded-login">
  ## Utiliser les SDK d'Auth0 pour implémenter la connexion intégrée
</div>

Vous pouvez implémenter la connexion <Tooltip tip="Sans mot de passe : forme d'authentification qui ne repose pas sur un mot de passe comme premier facteur." cta="Voir le glossaire" href="/docs/fr-ca/glossary?term=Passwordless">sans mot de passe</Tooltip> à l'aide du widget Lock d'Auth0 ou, si vous souhaitez un contrôle total de l'expérience utilisateur, l'implémenter avec Auth0.js :

* [Lock for Web](/docs/fr-ca/libraries/lock)
* [Référence d'Auth0.js](/docs/fr-ca/libraries/auth0js)

<div id="configure-cross-origin-resource-sharing-cors">
  ### Configurer le partage de ressources inter-origines (CORS)
</div>

Pour des raisons de sécurité, l’URL d’origine de votre application doit figurer parmi les URL autorisées. Si vous ne l’avez pas déjà ajoutée aux **Allowed Callback URLS** de votre application, vous devrez l’ajouter à la liste des **Allowed Origins (CORS)**.

1. Accédez à [Auth0 Dashboard > Applications > Applications](https://manage.auth0.com/#/applications), puis sélectionnez le nom de votre application pour afficher ses paramètres.
2. Repérez **Allowed Origins (CORS)**, entrez l’[URL d’origine](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin) de votre application, puis sélectionnez **Save Changes**.

<div id="customize-mfa">
  ## Personnaliser la MFA
</div>

<ReleaseStageNotice feature="MFA personnalisable avec les flux Resource Owner Password Grant, Embedded ou Refresh Token" stage="ea" terms="true" contact="Auth0 Support" />

Personnalisez <Tooltip tip="Authentification multifacteur (MFA) : processus d’authentification de l’utilisateur qui utilise un facteur en plus du nom d’utilisateur et mot de passe, comme un code envoyé par SMS." cta="Voir le glossaire" href="/docs/fr-ca/glossary?term=MFA">MFA</Tooltip> avec des flux intégrés. Utilisez la MFA API pour permettre aux utilisateurs d’inscrire le facteur pris en charge par votre application de leur choix et de répondre à la demande de vérification correspondante.

Lorsque vous utilisez [Lock for Web](/docs/fr-ca/libraries/lock#2-authenticating-and-getting-user-info), le point de terminaison `oauth/token` renvoie l’erreur `mfa_required` et inclut le `mfa_token` nécessaire pour utiliser la MFA API, ainsi que le paramètre `mfa_requirements` contenant la liste des méthodes d’authentification actuellement prises en charge par votre application :

```json lines theme={null}
{
  "error": "mfa_required",
  "error_description": "Multifactor authentication required",
  "mfa_token": "Fe26...Ha",
  "mfa_requirements": {
    "challenge": [
      { "type": "otp" },
      { "type": "push-notification" },
      { "type": "phone" },
      { "type": "recovery-code" }
      { "type": "email"} //fonctionne uniquement avec challenge
    ]
  }
}
```

Utilisez le `mfa_token` pour effectuer une requête vers le point de terminaison [`mfa/authenticator`](https://auth0.com/docs/api/authentication/muti-factor-authentication/list-authenticators) afin de lister tous les facteurs que l’utilisateur a déjà configurés et de repérer celui dont le `type` correspond à celui pris en charge par votre application. Vous devez aussi obtenir le `authenticator_type` correspondant pour émettre des demandes de vérification :

```json lines theme={null}
[
  {
    "type": "recovery-code",
    "id": "recovery-code|dev_qpOkGUOxBpw6R16t",
    "authenticator_type": "recovery-code",
    "active": true
  },
  {
    "type": "otp",
    "id": "totp|dev_6NWz8awwC8brh2dN",
    "authenticator_type": "otp",
    "active": true
  }
]
```

Appliquez ensuite le défi MFA en appelant le point de terminaison [`request/mfa/challenge`](https://auth0.com/docs/api/authentication/muti-factor-authentication/request-mfa-challenge).

Personnalisez davantage votre flux MFA avec Auth0 Actions. Pour en savoir plus, consultez [Déclencheurs des Actions : post-challenge - objet API](/docs/fr-ca/customize/actions/explore-triggers/password-reset-triggers/post-challenge-trigger/post-challenge-api-object).
