Maison  >  Article  >  Opération et maintenance  >  Configuration de la page d'erreur Nginx, embellissement des invites d'échec du site Web

Configuration de la page d'erreur Nginx, embellissement des invites d'échec du site Web

PHPz
PHPzoriginal
2023-07-04 13:33:112842parcourir

Configuration de la page d'erreur Nginx, embellissez les invites d'échec du site Web

Pendant le fonctionnement du site Web, il est inévitable de rencontrer des erreurs de serveur ou d'autres pannes. Ces problèmes empêcheront les utilisateurs d'accéder normalement au site Web. Afin d'améliorer l'expérience utilisateur et l'image du site Web, nous pouvons configurer les pages d'erreur Nginx pour embellir les invites d'échec du site Web. Cet article expliquera comment personnaliser la page d'erreur via la fonction de configuration de la page d'erreur de Nginx et fournira des exemples de code comme référence.

1. Modifier le fichier de configuration Nginx

Tout d'abord, nous devons ouvrir le fichier de configuration Nginx, qui se trouve généralement dans /etc/nginx/nginx.conf ou /etc/nginx/conf.d/default.conf. Recherchez le bloc serveur et ajoutez la configuration suivante :

server {
    ...
    error_page 403 /error/403.html;
    error_page 404 /error/404.html;
    error_page 500 502 503 504 /error/50x.html;
    ...
}

Dans la configuration ci-dessus, la directive error_page est utilisée pour définir le chemin de la page d'erreur, qui peut être un chemin de fichier local ou un URI. 403 indique une erreur d'accès refusé, 404 indique qu'il n'y a aucune erreur sur la page et 500, 502, 503 et 504 indiquent des erreurs de serveur.

2. Créer une page d'erreur

Nous devons créer le fichier de page d'erreur correspondant et l'enregistrer dans le chemin spécifié. Ensuite, nous prenons la page d'erreur 403 comme exemple, créons un fichier nommé 403.html et l'enregistrons dans le répertoire d'erreur sous le répertoire de configuration nginx.

$ sudo mkdir /usr/share/nginx/error
$ sudo touch /usr/share/nginx/error/403.html
$ sudo nano /usr/share/nginx/error/403.html

Dans 403.html, nous pouvons personnaliser le message d'erreur et ajouter du texte, des icônes, des liens, etc. pour rappeler aux utilisateurs qu'une erreur 403 s'est produite.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>403 Forbidden</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f6f6f6;
            margin: 0;
            padding: 50px;
            text-align: center;
        }
        h1 {
            font-size: 24px;
            color: #333;
            margin-bottom: 20px;
        }
        p {
            font-size: 18px;
            color: #666;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>
    <h1>403 Forbidden</h1>
    <p>抱歉,您没有权限访问该页面。</p>
</body>
</html>

3. Redémarrez Nginx

Après avoir terminé la configuration ci-dessus, nous devons redémarrer Nginx pour qu'elle prenne effet.

$ sudo systemctl restart nginx

4. Vérifiez la configuration

Entrez une URL inexistante dans le navigateur, telle que http://example.com/123456, et vous verrez la page d'erreur 404 personnalisée. Dans le même principe, lorsqu'un utilisateur n'a pas la permission d'accéder à une URL, notre page d'erreur 403 personnalisée sera également affichée.

Grâce à la configuration de la page d'erreur Nginx, nous pouvons embellir les invites de panne du site Web et améliorer l'expérience utilisateur et l'image du site Web. En plus des pages d'erreur 403 et 404, nous pouvons également personnaliser d'autres types de pages d'erreur, telles que 500, 502, 503, etc. Suivez simplement les étapes ci-dessus, ajoutez la directive error_page correspondante dans le fichier de configuration Nginx et créez le fichier de page d'erreur correspondant.

Résumé :

Nginx fournit des fonctions de configuration de page d'erreur flexibles, nous permettant de personnaliser les pages d'invite d'échec du site Web. Grâce à une conception élégante des pages d’erreur et à des informations rapides, nous pouvons améliorer l’expérience utilisateur tout en présentant une image conviviale et professionnelle aux utilisateurs. Ce qui précède est une introduction et un exemple de code pour la configuration de la page d'erreur Nginx. J'espère que cela vous sera utile pour embellir les invites d'erreur du site Web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn