# How to set error pages

import Tabs from '~/components/tabs/Tabs'

import Code from '~/components/Code/Code.astro'
import Apiv4Rollout from '~/includes/snippets/apiv4Rollout/en/snippet.mdx'

<Apiv4Rollout />

With this guide, you'll modify the default error response of your application, setting a cache TTL for each error received from the origin.

There are separate instructions for API v3 using [legacy Error Responses](/en/documentation/products/build/applications/error-responses/) settings and API v4 using the new [Custom Pages](/en/documentation/products/secure/custom-pages/) product.

:::tip
In this guide, there are separate instructions for API v3 and API v4. If you're not sure which steps apply to your account, see [the Verify Your Account Migration guide](/en/documentation/products/guides/verify-account-migration/) to determine if your account has already been migrated.
:::

<Tabs client:visible>
    <Fragment slot="tab.consolecustompages">Console - Custom Pages</Fragment>
    <Fragment slot="tab.consoleerrorresponses">Console - Error Responses</Fragment>

<Fragment slot="panel.consolecustompages">

Configure your application to handle error responses from the origin using [Custom Pages](/en/documentation/products/secure/custom-pages/). Azion allows you to set a cache TTL for error pages, a custom path, or deliver another HTTP code in the response without needing to change the source code of your application.

---

1. Access [Azion Console](/en/documentation/products/guides/how-to-access-azion-console/) > **Custom Pages**.
2. Click **+ Custom Page**.
3. In the **Page Codes** section, click **+ Custom Page Code** to add a page for a chosen status code. For example: `404`.
4. In the new **Page Code** field, select the status code you want to customize.
5. In the **Connector** field, select the [Connector](/en/documentation/products/secure/connectors/) that is fetching the data from your origin. 
6 In the **Page Path** field, add a *path* to an error page created in the source. For example: `/error/404`.
1. In **Response TTL**, set the cache *time-to-live* (TTL), in seconds.
2. In the **Response Custom Status Code** field, customize the HTTP status that'll be received by the user.
3. Click the **Apply** button.

Now let's bind the Custom Page to your [Workload](/en/documentation/products/secure/workloads/).

1. Access [Azion Console](/en/documentation/products/guides/how-to-access-azion-console/) > **Workloads**.
2. Edit the desired Workload.
3. In the **Deployment Settings** section, select your Custom Page.
4. Click the **Save** button.

When errors are received from the Connector, your application will cache and display the error page based on the new configuration.

</Fragment>

<Fragment slot="panel.consoleerrorresponses">

Configure your application to handle error responses from the origin using [Error Responses](/en/documentation/products/build/applications/error-responses/). Azion allows you to set a cache TTL for error pages, a custom path, or deliver another HTTP code in the response without needing to change the source code of your application.

With this guide, you'll modify the default error response of your application, setting a cache TTL for each error received from the origin.

---

1. Access [Azion Console](/en/documentation/products/guides/how-to-access-azion-console/) > **Applications**.
2. Click the application you want to configure.
3. Select the **Error Responses** tab.

In the **Error Responses** section, the **Status Code** field can't be modified. This field represents every error status code received from the origin. The **Default Response TTL** field allows you to customize the cache TTL for every status code received.

4. In **Default Response TTL**, set the cache *time-to-live* (TTL), in seconds, for all error pages.
5. Click the **+ Error Response** button.
6. In the new **Status Code** field, select the status code you want to customize. For example: `404`.
7. Add a cache TTL in the **Custom Response TTL** field.

You can also determine a specific path from your origin that will be delivered to the user and a custom status code in the response. These modifications are optional.

8. In the **Page Path** field, add a *path* to an error page created in the source. For example: `/error/404`.
9. In the **Response Status Code** field, customize the HTTP status that'll be received by the user.
10. In the **Set Origin** section, select the origin of error page URIs.
11. Click the **Save** button.

When errors are received from the origin, your application will cache and display the error page based on the new configuration.

</Fragment>
</Tabs>