{{error | escape }} {{error_description | escape }} This error was generated {{'\''now'\'' | date: '\''%Y %h'\''}}.

> ## 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.

# Personnaliser les pages d’erreur

> Découvrez comment créer une page d’erreur personnalisée pour les erreurs d’autorisation.

export const AuthCodeGroup = ({children, dropdown}) => {
  const [processedChildren, setProcessedChildren] = useState(children);
  useEffect(() => {
    let unsubscribe = null;
    function init() {
      unsubscribe = window.autorun(() => {
        const processChildren = node => {
          if (typeof node === "string") {
            let processedNode = node;
            for (const [key, value] of window.rootStore.variableStore.values.entries()) {
              const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
              processedNode = processedNode.replaceAll(new RegExp(escapedKey, "g"), value);
            }
            return processedNode;
          } else if (Array.isArray(node)) {
            return node.map(processChildren);
          } else if (node && node.props && node.props.children) {
            return {
              ...node,
              props: {
                ...node.props,
                children: processChildren(node.props.children)
              }
            };
          }
          return node;
        };
        setProcessedChildren(processChildren(children));
      });
    }
    if (window.rootStore) {
      init();
    } else {
      window.addEventListener("adu:storeReady", init);
    }
    return () => {
      window.removeEventListener("adu:storeReady", init);
      unsubscribe?.();
    };
  }, [children]);
  return <CodeGroup dropdown={dropdown}>{processedChildren}</CodeGroup>;
};

export const AuthCodeBlock = ({filename, icon, language, highlight, children}) => {
  const [displayText, setDisplayText] = useState(children);
  const [copyText, setCopyText] = useState(children);
  const wrapperRef = React.useRef(null);
  useEffect(() => {
    let unsubscribe = null;
    function init() {
      if (!window.autorun || !window.rootStore) {
        return;
      }
      unsubscribe = window.autorun(() => {
        let processedChildrenForDisplay = children;
        let processedChildrenForCopy = children;
        for (const [key, value] of window.rootStore.variableStore.values.entries()) {
          const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
          let displayValue = value;
          if (key === "{yourClientSecret}" && value !== "{yourClientSecret}") {
            displayValue = value.substring(0, 3) + "*****MASQUÉ*****";
          }
          processedChildrenForDisplay = processedChildrenForDisplay.replaceAll(new RegExp(escapedKey, "g"), displayValue);
          processedChildrenForCopy = processedChildrenForCopy.replaceAll(new RegExp(escapedKey, "g"), value);
        }
        setDisplayText(processedChildrenForDisplay);
        setCopyText(processedChildrenForCopy);
      });
    }
    if (window.rootStore) {
      init();
    } else {
      window.addEventListener("adu:storeReady", init);
    }
    return () => {
      window.removeEventListener("adu:storeReady", init);
      unsubscribe?.();
    };
  }, [children]);
  useEffect(() => {
    if (!wrapperRef.current) return;
    const originalWriteText = navigator.clipboard.writeText.bind(navigator.clipboard);
    let isOverriding = false;
    const handleClick = e => {
      const button = e.target.closest('[data-testid="copy-code-button"]');
      if (!button || !wrapperRef.current.contains(button)) return;
      isOverriding = true;
      navigator.clipboard.writeText = text => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
          return originalWriteText(copyText);
        }
        return originalWriteText(text);
      };
      setTimeout(() => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
        }
      }, 100);
    };
    const wrapper = wrapperRef.current;
    wrapper.addEventListener('click', handleClick, true);
    return () => {
      wrapper.removeEventListener('click', handleClick, true);
      if (navigator.clipboard.writeText !== originalWriteText) {
        navigator.clipboard.writeText = originalWriteText;
      }
    };
  }, [copyText]);
  return <div ref={wrapperRef}>
      <CodeBlock filename={filename} icon={icon} language={language} lines highlight={highlight}>
        {displayText}
      </CodeBlock>
    </div>;
};

Lorsqu’une erreur d’autorisation se produit et que votre URL de rappel est valide, le <Tooltip tip="Serveur d’autorisation : serveur centralisé qui aide à définir les limites de l’accès d’un utilisateur. Par exemple, votre serveur d’autorisation peut contrôler les données, les tâches et les fonctionnalités auxquelles un utilisateur a accès." cta="Voir le glossaire" href="/docs/fr-ca/glossary?term=Authorization+Server">serveur d’autorisation</Tooltip> renvoie à votre URL de rappel les paramètres d’erreur et de state appropriés. Si votre URL de rappel n’est pas valide, votre application affichera la [page d’erreur Auth0 par défaut](/docs/fr-ca/authenticate/login/auth0-universal-login/error-pages).

Votre application peut aussi afficher la page d’erreur Auth0 par défaut pour d’autres raisons qu’une URL de rappel non valide, par exemple :

* Des paramètres obligatoires sont manquants lors de l’appel au [point de terminaison de connexion](https://auth0.com/docs/api/authentication#login) de l’API d’authentification Auth0.
* L’utilisateur ouvre un lien de réinitialisation du mot de passe expiré (lorsqu’il utilise l’expérience de connexion Classic Login).
* L’utilisateur accède à une page de connexion enregistrée dans ses favoris et aucune [route de connexion par défaut](/docs/fr-ca/authenticate/login/auth0-universal-login/configure-default-login-routes) n’est précisée.

<div id="parameters">
  ## Paramètres
</div>

Si vous choisissez de configurer une page d’erreur personnalisée, le serveur d’autorisation renverra des paramètres ajoutés à l’URL sous forme de chaîne de requête.

| Paramètre           | Description                                                                      |
| ------------------- | -------------------------------------------------------------------------------- |
| `client_id`         | Identifiant de l’application Auth0.                                              |
| `connection`        | Connexion utilisée au moment de l’erreur.                                        |
| `lang`              | Langue définie au moment de l’erreur.                                            |
| `error`             | Code de l’erreur.                                                                |
| `error_description` | Description de l’erreur.                                                         |
| `tracking`          | Identifiant utilisé par Auth0 pour retrouver des erreurs dans les logs internes. |

Les paramètres fournis varient selon le type d’erreur et sont propres à la requête. Par exemple, si la requête ayant entraîné une erreur ne contenait pas de `client_id`, le serveur d’autorisation ne renverra pas le paramètre `client_id`.

<div id="display-a-custom-error-page">
  ## Afficher une page d’erreur personnalisée
</div>

Si vous souhaitez afficher une page d’erreur personnalisée, deux options s’offrent à vous :

* Rediriger les utilisateurs vers une page d’erreur personnalisée à l’aide de l’Auth0 Dashboard ou de l’Auth0 Management API.
* Configurer Auth0 pour qu’il affiche une page d’erreur personnalisée pour vous au moyen de la Management API.

<div id="redirect-users-to-a-custom-error-page-using-the-dashboard">
  ### Rediriger les utilisateurs vers une page d’erreur personnalisée à l’aide du Dashboard
</div>

Utilisez le Dashboard pour configurer Auth0 afin qu’il redirige les utilisateurs vers une page d’erreur personnalisée :

1. Accédez à [Auth0 Dashboard > Settings](https://manage.auth0.com/#/tenant/).
2. Dans l’onglet **General**, repérez la section **Error Pages**.
3. Pour **Default Error Page**, sélectionnez **Custom**.
4. Dans le champ **Custom error page URL** qui s’affiche, entrez l’URL de la page d’erreur que vous souhaitez montrer à vos utilisateurs.
5. Sélectionnez **Save**.

<div id="redirect-users-to-a-custom-error-page-using-the-management-api">
  ### Rediriger les utilisateurs vers une page d’erreur personnalisée à l’aide de la Management API
</div>

Utilisez le point de terminaison <Tooltip tip="Management API : Un produit qui permet aux clients d’effectuer des tâches administratives." cta="Voir le glossaire" href="/docs/fr-ca/glossary?term=Management+API">Management API</Tooltip> [Update Tenant Settings](https://auth0.com/docs/api/management/v2/#!/Tenants/patch_settings). Remplacez la valeur de l’espace réservé `{mgmtApiAccessToken}` par votre <Tooltip tip="jeton d’accès : Informations d’autorisation, sous la forme d’une chaîne opaque ou d’un JWT, utilisées pour accéder à une API." cta="Voir le glossaire" href="/docs/fr-ca/glossary?term=Access+Token">jeton d’accès</Tooltip> de la Management API, puis mettez à jour la valeur du champ `url` dans le corps JSON pour qu’il pointe vers l’emplacement de la page d’erreur.

<AuthCodeGroup>
  ```bash cURL theme={null}
  curl --request PATCH \
    --url 'https://{yourDomain}/api/v2/tenants/settings' \
    --header 'authorization: Bearer {mgmtApiAccessToken}' \
    --header 'content-type: application/json' \
    --data '{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}'
  ```

  ```csharp C# theme={null}
  var client = new RestClient("https://{yourDomain}/api/v2/tenants/settings");
  var request = new RestRequest(Method.PATCH);
  request.AddHeader("authorization", "Bearer {mgmtApiAccessToken}");
  request.AddHeader("content-type", "application/json");
  request.AddParameter("application/json", "{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}", ParameterType.RequestBody);
  IRestResponse response = client.Execute(request);
  ```

  ```go Go theme={null}
  package main

  import (
  	"fmt"
  	"strings"
  	"net/http"
  	"io/ioutil"
  )

  func main() {

  	url := "https://{yourDomain}/api/v2/tenants/settings"

  	payload := strings.NewReader("{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}")

  	req, _ := http.NewRequest("PATCH", url, payload)

  	req.Header.Add("authorization", "Bearer {mgmtApiAccessToken}")
  	req.Header.Add("content-type", "application/json")

  	res, _ := http.DefaultClient.Do(req)

  	defer res.Body.Close()
  	body, _ := ioutil.ReadAll(res.Body)

  	fmt.Println(res)
  	fmt.Println(string(body))

  }
  ```

  ```java Java theme={null}
  HttpResponse<String> response = Unirest.patch("https://{yourDomain}/api/v2/tenants/settings")
    .header("authorization", "Bearer {mgmtApiAccessToken}")
    .header("content-type", "application/json")
    .body("{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}")
    .asString();
  ```

  ```javascript Node.JS theme={null}
  var axios = require("axios").default;

  var options = {
    method: 'PATCH',
    url: 'https://{yourDomain}/api/v2/tenants/settings',
    headers: {
      authorization: 'Bearer {mgmtApiAccessToken}',
      'content-type': 'application/json'
    },
    data: {error_page: {html: '', show_log_link: false, url: 'http://www.example.com'}}
  };

  axios.request(options).then(function (response) {
    console.log(response.data);
  }).catch(function (error) {
    console.error(error);
  });
  ```

  ```php PHP theme={null}
  $curl = curl_init();

  curl_setopt_array($curl, [
    CURLOPT_URL => "https://{yourDomain}/api/v2/tenants/settings",
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_ENCODING => "",
    CURLOPT_MAXREDIRS => 10,
    CURLOPT_TIMEOUT => 30,
    CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
    CURLOPT_CUSTOMREQUEST => "PATCH",
    CURLOPT_POSTFIELDS => "{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}",
    CURLOPT_HTTPHEADER => [
      "authorization: Bearer {mgmtApiAccessToken}",
      "content-type: application/json"
    ],
  ]);

  $response = curl_exec($curl);
  $err = curl_error($curl);

  curl_close($curl);

  if ($err) {
    echo "cURL Error #:" . $err;
  } else {
    echo $response;
  }
  ```

  ```python Python theme={null}
  import http.client

  conn = http.client.HTTPSConnection("")

  payload = "{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}"

  headers = {
      'authorization': "Bearer {mgmtApiAccessToken}",
      'content-type': "application/json"
      }

  conn.request("PATCH", "/{yourDomain}/api/v2/tenants/settings", payload, headers)

  res = conn.getresponse()
  data = res.read()

  print(data.decode("utf-8"))
  ```

  ```ruby Ruby theme={null}
  require 'uri'
  require 'net/http'
  require 'openssl'

  url = URI("https://{yourDomain}/api/v2/tenants/settings")

  http = Net::HTTP.new(url.host, url.port)
  http.use_ssl = true
  http.verify_mode = OpenSSL::SSL::VERIFY_PEER

  request = Net::HTTP::Patch.new(url)
  request["authorization"] = 'Bearer {mgmtApiAccessToken}'
  request["content-type"] = 'application/json'
  request.body = "{"error_page": {"html": "", "show_log_link":false, "url": "http://www.example.com"}}"

  response = http.request(request)
  puts response.read_body
  ```
</AuthCodeGroup>

| Valeur                  | Description                                                                                                                     |
| ----------------------- | ------------------------------------------------------------------------------------------------------------------------------- |
| `MGMT_API_ACCESS_TOKEN` | [Jeton d’accès pour la Management API](https://auth0.com/docs/api/management/v2/tokens) avec le scope `update:tenant_settings`. |
| `show_log_link`         | Indique s’il faut afficher un lien vers l’erreur dans les journaux de votre tenant. Les valeurs valides sont `true` et `false`. |
| `url`                   | URL de la page d’erreur personnalisée vers laquelle vous souhaitez rediriger.                                                   |

<div id="render-a-custom-error-page">
  ### Afficher une page d’erreur personnalisée
</div>

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  Lorsque des erreurs s’affichent dans le widget Classic Login (par exemple, un lien de réinitialisation du mot de passe expiré), une page d’erreur personnalisée hébergée par Auth0 ne sera pas affichée, même si elle est configurée.
</Callout>

Utilisez le point de terminaison [Update Tenant Settings](https://auth0.com/docs/api/management/v2/#!/Tenants/patch_settings) de la Management API. Remplacez la valeur de l’espace réservé `{mgmtApiAccessToken}` par votre jeton d’accès de la Management API, puis mettez à jour la valeur du champ `html` dans le corps JSON par une chaîne contenant le code HTML de votre page.

Vous pouvez utiliser la syntaxe Liquid pour inclure les variables suivantes :

* `{client_id}`
* `{connection}`
* `{lang}`
* `{error}`
* `{error_description}`
* `{tracking}`

<AuthCodeGroup>
  ```bash cURL lines theme={null}
  curl --request PATCH \
    --url https://login.auth0.com/api/v2/tenants/settings \
    --header 'authorization: Bearer MGMT_API_ACCESS_TOKEN' \
    --header 'content-type: application/json' \
    --data '{"error_page": {"html": "<h1>{{error | escape }} {{error_description | escape }} This error was generated {{'\''now'\'' | date: '\''%Y %h'\''}}.</h1>", "show_log_link": false, "url": ""}}'
  ```

  ```csharp C# lines theme={null}
  var client = new RestClient("https://login.auth0.com/api/v2/tenants/settings");
  var request = new RestRequest(Method.PATCH);
  request.AddHeader("authorization", "Bearer MGMT_API_ACCESS_TOKEN");
  request.AddHeader("content-type", "application/json");
  request.AddParameter("application/json", "{\"error_page\": {\"html\": \"

  # {{error | escape }} {{error_description | escape }} This error was generated {{'now' | date: '%Y %h'}}.

  \", \"show_log_link\": false, \"url\": \"\"}}", ParameterType.RequestBody);
  IRestResponse response = client.Execute(request);
  ```

  ```go Go lines expandable theme={null}
  package main

  import (
  	"fmt"
  	"strings"
  	"net/http"
  	"io/ioutil"
  )

  func main() {

  	url := "https://login.auth0.com/api/v2/tenants/settings"

  	payload := strings.NewReader("{\"error_page\": {\"html\": \"<h1>{{error | escape }} {{error_description | escape }} This error was generated {{'now' | date: '%Y %h'}}.</h1>\", \"show_log_link\": false, \"url\": \"\"}}")

  	req, _ := http.NewRequest("PATCH", url, payload)

  	req.Header.Add("authorization", "Bearer MGMT_API_ACCESS_TOKEN")
  	req.Header.Add("content-type", "application/json")

  	res, _ := http.DefaultClient.Do(req)

  	defer res.Body.Close()
  	body, _ := ioutil.ReadAll(res.Body)

  	fmt.Println(res)
  	fmt.Println(string(body))

  }
  ```

  ```java Java lines theme={null}
  HttpResponse<String> response = Unirest.patch("https://login.auth0.com/api/v2/tenants/settings")
    .header("authorization", "Bearer MGMT_API_ACCESS_TOKEN")
    .header("content-type", "application/json")
    .body("{\"error_page\": {\"html\": \"<h1>{{error | escape }} {{error_description | escape }} This error was generated {{'now' | date: '%Y %h'}}.</h1>\", \"show_log_link\": false, \"url\": \"\"}}")
    .asString();
  ```

  ```javascript Node.JS lines theme={null}
  var axios = require("axios").default;

  var options = {
    method: 'PATCH',
    url: 'https://login.auth0.com/api/v2/tenants/settings',
    headers: {
      authorization: 'Bearer MGMT_API_ACCESS_TOKEN',
      'content-type': 'application/json'
    },
    data: {
      error_page: {
        html: '<h1>{{error | escape }} {{error_description | escape }} This error was generated {{\'now\' | date: \'%Y %h\'}}.</h1>',
        show_log_link: false,
        url: ''
      }
    }
  };

  axios.request(options).then(function (response) {
    console.log(response.data);
  }).catch(function (error) {
    console.error(error);
  });
  ```

  ```php PHP lines expandable theme={null}
  $curl = curl_init();

  curl_setopt_array($curl, [
    CURLOPT_URL => "https://login.auth0.com/api/v2/tenants/settings",
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_ENCODING => "",
    CURLOPT_MAXREDIRS => 10,
    CURLOPT_TIMEOUT => 30,
    CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
    CURLOPT_CUSTOMREQUEST => "PATCH",
    CURLOPT_POSTFIELDS => "{\"error_page\": {\"html\": \"<h1>{{error | escape }} {{error_description | escape }} This error was generated {{'now' | date: '%Y %h'}}.</h1>\", \"show_log_link\": false, \"url\": \"\"}}",
    CURLOPT_HTTPHEADER => [
      "authorization: Bearer MGMT_API_ACCESS_TOKEN",
      "content-type: application/json"
    ],
  ]);

  $response = curl_exec($curl);
  $err = curl_error($curl);

  curl_close($curl);

  if ($err) {
    echo "cURL Error #:" . $err;
  } else {
    echo $response;
  }
  ```

  ```python Python lines theme={null}
  import http.client

  conn = http.client.HTTPSConnection("login.auth0.com")

  payload = "{\"error_page\": {\"html\": \"<h1>{{error | escape }} {{error_description | escape }} This error was generated {{'now' | date: '%Y %h'}}.</h1>\", \"show_log_link\": false, \"url\": \"\"}}"

  headers = {
      'authorization': "Bearer MGMT_API_ACCESS_TOKEN",
      'content-type': "application/json"
      }

  conn.request("PATCH", "/api/v2/tenants/settings", payload, headers)

  res = conn.getresponse()
  data = res.read()

  print(data.decode("utf-8"))
  ```

  ```ruby Ruby lines theme={null}
  require 'uri'
  require 'net/http'
  require 'openssl'

  url = URI("https://login.auth0.com/api/v2/tenants/settings")

  http = Net::HTTP.new(url.host, url.port)
  http.use_ssl = true
  http.verify_mode = OpenSSL::SSL::VERIFY_PEER

  request = Net::HTTP::Patch.new(url)
  request["authorization"] = 'Bearer MGMT_API_ACCESS_TOKEN'
  request["content-type"] = 'application/json'
  request.body = "{\"error_page\": {\"html\": \"<h1>{{error | escape }} {{error_description | escape }} This error was generated {{'now' | date: '%Y %h'}}.</h1>\", \"show_log_link\": false, \"url\": \"\"}}"

  response = http.request(request)
  puts response.read_body
  ```
</AuthCodeGroup>

| Valeur                  | Description                                                                                                                       |
| ----------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| `MGMT_API_ACCESS_TOKEN` | [Jeton d’accès pour la Management API](https://auth0.com/docs/api/management/v2/tokens) avec la portée `update:tenant_settings`.  |
| `show_log_link`         | Indique s’il faut afficher un lien vers l’erreur dans les journaux de votre tenant. Les valeurs acceptées sont `true` et `false`. |
| `html`                  | HTML de la page d’erreur personnalisée que vous souhaitez afficher.                                                               |

Pour éviter les vulnérabilités XSS, assainissez votre gabarit personnalisé à l’aide des filtres [escape](https://shopify.github.io/liquid/filters/escape/) et [strip\_html](https://shopify.github.io/liquid/filters/strip_html/) de Liquid.