10. Pages d'erreur

Il y a une question que l'on ne se pose souvent pas assez lorsqu'on construit une application web : la gestion des erreurs.

C'est un problème complexe qui n'a pas de réponse universelle, mais il faut a minima être capable d'afficher une page d'erreur si quelque chose se passe mal.

En résumant à la truelle, il existe deux types d'erreurs nécessitant l'affichage d'une page dédiée :

• la page introuvable (erreur 404)
• l'erreur serveur imprévue (erreur 500)

Page d'erreur par défaut

SvelteKit est capable d'afficher une page d'erreur par défaut lorsque nécessaire.

Par exemple, si vous naviguez sur une page n'existant pas, vous devriez avoir une page affichant le message "404: Not Found".

De même, si quelque chose d'imprévu se produit sur le serveur, par exemple dans une page +page.server.ts, la page qui s'affiche devrait afficher le message "500: Internal error".

// n'importe quel fichier +page.server.ts ou +layout.server.ts
export async function load() {
	// on peut simuler une erreur imprévue de cette manière
	throw new Error('Boum !');
}

Dans les deux cas, la page affichée est la page d'erreur par défaut de SvelteKit.

Pages d'erreur personnalisées

Si cette page d'erreur par défaut ne vous convient pas, vous pouvez tout à fait la personnaliser.

Pour cela, il suffit de créer un fichier +error.svelte dans le dossier routes/.