Introduzione
Ogni volta che NGINX rileva un errore mentre tenta di elaborare la richiesta di un client, restituisce un errore. Ogni errore include un codice di risposta HTTP e una breve descrizione. L'errore di solito viene visualizzato all'utente tramite una semplice pagina HTML predefinita.
Fortunatamente, puoi configurare NGINX per visualizzare pagine di errore personalizzate per gli utenti del tuo sito o dell'applicazione web. Ciò può essere ottenuto utilizzando la direttiva error_page di NGINX che viene utilizzata per definire l'URI che verrà mostrato per un errore specificato. Puoi anche, facoltativamente, usarlo per modificare il codice di stato HTTP nelle intestazioni delle risposte inviate a un client.
In questa guida, mostreremo come configurare NGINX per utilizzare pagine di errore personalizzate.
Creare una singola pagina personalizzata per tutti gli errori NGINX
Puoi configurare NGINX per utilizzare una singola pagina di errore personalizzata per tutti gli errori che restituisce a un client. Inizia creando la tua pagina di errore. Ecco un esempio, una semplice pagina HTML che visualizza il seguente messaggio:
“Sorry, the page can't be loaded! Contact the site's administrator or support for assistance.” to a client.Esempio di codice di pagina HTML Nginx personalizzato:
<!DOCTYPE html>
<html>
<head>
<style type=text/css>
* {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
body {
padding: 0;
margin: 0;
}
#notfound {
position: relative;
height: 100vh;
}
#notfound .notfound {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.notfound {
max-width: 520px;
width: 100%;
line-height: 1.4;
text-align: center;
}
.notfound .notfound-error {
position: relative;
height: 200px;
margin: 0px auto 20px;
z-index: -1;
}
.notfound .notfound-error h1 {
font-family: 'Montserrat', sans-serif;
font-size: 200px;
font-weight: 300;
margin: 0px;
color: #211b19;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
@media only screen and (max-width: 767px) {
.notfound .notfound-error h1 {
font-size: 148px;
}
}
@media only screen and (max-width: 480px) {
.notfound .notfound-error {
height: 148px;
margin: 0px auto 10px;
}
.notfound .notfound-error h1 {
font-size: 120px;
font-weight: 200px;
}
.notfound .notfound-error h2 {
font-size: 30px;
}
.notfound a {
padding: 7px 15px;
font-size: 24px;
}
.h2 {
font-size: 148px;
}
}
</style>
</head>
<body>
<div id="notfound">
<div class="notfound">
<h1>Sorry the page can't be loaded!</a></h1>
<div class="notfound-error">
<p>Contact the site's administrator or support for assistance.</p>
</div>
</div>
</div>
</body>
</html>Salva il file con un nome appropriato, ad esempio error-page.html e chiudilo.
Quindi, sposta il file nella directory principale del documento /var/www/html/. Se la directory non esiste, puoi crearla usando il comando mkdir, come mostrato:
sudo mkdir -p /var/www/html/sudo cp error-page.html /var/www/html/Quindi configura NGINX per utilizzare la pagina di errore personalizzata utilizzando la direttiva error_page. Crea un file di configurazione chiamato custom-error-page.conf in /etc/nginx/snippets/ come mostrato:
sudo mkdir /etc/nginx/snippets/sudo nano /etc/nginx/snippets/custom-error-page.conf Aggiungi le seguenti righe ad esso:
error_page 404 403 500 503 /error-page.html;
location = /error-page.html {
root /var/www/html;
internal;
}Questa configurazione provoca un reindirizzamento interno all'URI /error-page.html ogni volta che NGINX rileva uno degli errori HTTP specificati 404, 403, 500 e 503. Il contesto della posizione indica a NGINX dove trovare la pagina di errore.
Salva e chiudi il file.
Ora includi il file nel contesto http in modo che tutti i blocchi del server utilizzino la pagina di errore, nel file /etc/nginx/nginx.conf:
sudo vim /etc/nginx/nginx.confLa directory include dice a NGINX di includere la configurazione nel file .conf specificato:
include snippets/custom-error-page.conf;In alternativa, puoi includere il file per un blocco server specifico (comunemente noto come vhost), ad esempio /etc/nginx/conf.d/mywebsite.conf. Aggiungi la direttiva include sopra nel contesto del server {}.
Salva il tuo file di configurazione NGINX e ricarica il servizio come segue:
sudo systemctl reload nginx.servicProva da un browser se l'installazione funziona correttamente.
Conclusione
La direttiva error_page di NGINX ti consente di reindirizzare gli utenti a una pagina o risorsa o URL definita quando si verifica un errore. Facoltativamente, consente anche la modifica del codice di stato HTTP nella risposta a un client. Per ulteriori informazioni, leggi la documentazione della pagina di errore di nginx.
