Skip to main content

Avant de commencer

  • Pour des raisons de sécurité, l’URL d’origine de votre application doit figurer parmi les URL approuvé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).
  • Assurez-vous que Allowed Web Origins, dans la vue Settings de votre application, est défini sur le domaine à l’origine de la requête. Les URL peuvent contenir des caractères génériques pour les sous-domaines, mais elles ne peuvent pas contenir de chemins relatifs après l’URL du domaine. Pour en savoir plus, consultez Espaces réservés pour les sous-domaines.
  • Si vous n’activez pas Custom Domains, vous devrez créer une page de vérification qui utilise Auth0.js comme solution de secours pour l’authentification inter-origines.
Le partage de ressources entre origines multiples (CORS) est un mécanisme qui permet à une application de charger des données (ressource) à partir d’un domaine (origine) différent de celui où elle est hébergée. Une politique CORS constitue une exception explicite à la politique de même origine, courante dans les applications Web. Par exemple, si vous vouliez que votre application (app.mydomain.com) récupère en arrière-plan, à l’aide d’Ajax, une police depuis Google (fonts.google.com), vous devriez configurer CORS.

Configurer l’authentification d’origine croisée

  1. Accédez à Dashboard > Applications > Applications et cliquez sur le nom de l’application à consulter.
  2. Sous Cross-Origin Authentication, activez la bascule Allow Cross-Origin Authentication.
  3. Repérez Allowed Origins (CORS), puis saisissez l’URL d’origine de votre application. Pour en savoir plus sur les origines, consultez Origin on Mozilla MDN Web Docs.
  4. Cliquez sur Save Changes.
Si vous n’avez pas besoin d’utiliser CORS pour votre application, assurez-vous que la bascule Allow Cross-Origin Authentication est désactivée.

Créer une page de vérification inter-origines

Dans certains cas, les cookies tiers ne sont pas disponibles. Certaines versions de navigateurs ne prennent pas en charge les cookies tiers et, même lorsqu’elles le font, ils peuvent être désactivés dans les paramètres de l’utilisateur. Pour les navigateurs pris en charge, vous pouvez utiliser la méthode crossOriginVerification du SDK Auth0.js dans votre application, sur une page dédiée, pour gérer les cas où les cookies tiers sont désactivés. Pour les navigateurs qui ne sont pas pris en charge, comme Chrome, Opera et Safari, l’authentification d’origine croisée ne fonctionnera pas lorsque les cookies tiers sont désactivés, sauf si vous activez les Domaines personnalisés.
Le paramètre de Safari est intitulé “Prevent cross-site tracking” et utilise la fonctionnalité Intelligent Tracking Prevention. Malheureusement, cela empêche aussi les cookies tiers d’être utiles dans les scénarios d’authentification. Voici un exemple de l’effet que cela a sur le renouvellement de jeton dans Safari.
  1. Créez une page dans votre application qui instancie WebAuth à partir de Auth0.js. Appelez crossOriginVerification immédiatement. Vous pouvez donner à cette page le nom de votre choix.
Lorsque les cookies tiers ne sont pas disponibles, Auth0.js affiche une iframe pour lancer un autre flux de vérification inter-origines. 2. Accédez à Dashboard > Applications > Applications, puis sélectionnez l’application à consulter. 3. Sous Authentification d’origine croisée, ajoutez l’URL de la page de callback que vous avez créée dans le champ URL de secours pour la vérification inter-origines.
Pour les environnements de production, vérifiez que l’URL de la page ne pointe pas vers localhost. La page doit se trouver dans le même domaine où est hébergé le formulaire de connexion intégrée et doit utiliser le schéma https.
  1. Cliquez sur Enregistrer les modifications.
Pour plus de détails, consultez l’exemple d’authentification d’origine croisée sur GitHub.

Codes d’erreur et descriptions

Les descriptions d’erreur sont conçues pour être lisibles par des humains. Elles peuvent changer en tout temps et ne devraient pas être analysées par du code.
Lorsque Auth0.js (ou Lock) est utilisé pour la connexion intégrée, il envoie une requête à l’endpoint /co/authenticate, qui peut retourner les erreurs suivantes : De plus, vous pouvez aussi obtenir une erreur 403 générique sans propriété error ni error_description. Le corps de la réponse inclurait simplement quelque chose de semblable à ce qui suit : Origin https://test.app is not allowed.

Prise en charge des tests dans les navigateurs

Les navigateurs suivants peuvent utiliser l’authentification d’origine croisée lorsque les cookies tiers sont désactivés :
  • Microsoft Internet Explorer

Attributs SameSite des cookies

Auparavant, les options de l’attribut de cookie samesite étaient true, false, strict ou lax. Si vous ne définissiez pas cet attribut manuellement, Auth0 utilisait la valeur par défaut false.À partir de février 2020, Google Chrome v80 a modifié sa façon de gérer les cookies, et Auth0 a apporté les changements suivants en conséquence :
  • Les cookies sans attribut samesite seront définis sur lax.
  • Les cookies avec sameSite=none doivent être sécurisés, sinon ils ne peuvent pas être enregistrés dans l’espace de stockage des cookies du navigateur.
L’objectif de ces changements est d’améliorer la sécurité et d’aider à atténuer les attaques de falsification de requêtes intersites (CSRF).

En savoir plus