En aquest tema, aprendrem com configurar NGINX per mostrar llistats de directoris. Aquesta funcionalitat és útil quan volem permetre als usuaris veure i accedir als fitxers d'un directori específic a través del navegador.

• Entendre què són els llistats de directoris.
• Aprendre a configurar NGINX per mostrar llistats de directoris.
• Personalitzar l'aparença dels llistats de directoris.

Els llistats de directoris són pàgines generades automàticament per NGINX que mostren el contingut d'un directori. Quan un usuari accedeix a un directori que no té un fitxer d'índex (com index.html), NGINX pot mostrar una llista dels fitxers i subdirectoris que conté.

Per habilitar els llistats de directoris en NGINX, hem d'utilitzar el mòdul autoindex. A continuació, es mostra com configurar-ho en el fitxer de configuració de NGINX.

1. Obre el fitxer de configuració de NGINX. Normalment es troba a /etc/nginx/nginx.conf o en un fitxer de configuració específic del lloc a /etc/nginx/sites-available/.

2. Afegeix la directiva autoindex dins del bloc server o location. Aquí teniu un exemple de configuració:

• listen 80;: Indica que el servidor escoltarà a la porta 80.
• server_name exemple.com;: Defineix el nom del servidor.
• location /directori { ... }: Defineix una ubicació específica per al directori /directori.
• root /var/www/html;: Defineix el directori arrel on es troben els fitxers.
• autoindex on;: Habilita els llistats de directoris.
• autoindex_exact_size off;: Mostra la mida dels fitxers en unitats llegibles (KB, MB, etc.) en lloc de bytes.
• autoindex_localtime on;: Mostra la data i hora locals dels fitxers en lloc de l'hora UTC.

NGINX permet personalitzar l'aparença dels llistats de directoris mitjançant fitxers d'estil CSS. A continuació, es mostra com fer-ho:

1. Crea un fitxer CSS. Per exemple, autoindex.css:

2. Modifica la configuració de NGINX per utilitzar el fitxer CSS:

• autoindex_format html;: Indica que els llistats de directoris es generaran en format HTML.
• add_after_body /autoindex.css;: Afegeix el fitxer CSS després del cos de la pàgina per personalitzar l'aparença.
• location /autoindex.css { ... }: Defineix una ubicació per al fitxer CSS.

1. Configura NGINX per mostrar llistats de directoris per al directori /var/www/html/files.
2. Personalitza l'aparença dels llistats de directoris utilitzant un fitxer CSS.

1. Configuració de NGINX:

2. Fitxer CSS (/var/www/html/autoindex.css):

En aquesta secció, hem après com configurar NGINX per mostrar llistats de directoris i com personalitzar l'aparença d'aquests llistats utilitzant fitxers CSS. Aquesta funcionalitat és útil per permetre als usuaris veure i accedir als fitxers d'un directori específic a través del navegador.