Come configurare Node JS su un server Apache

Partiamo dai perché

Esporre direttamente un'istanza Node JS al web non è mai un fantastica idea. Le motivazioni risiedono in un mix di più motivazioni: la probabilità che l'app smetta di funzionare qualora un end point non sia configurato a dovere (e quando diciamo l'app intendiamo l'intera app); le migliori capacità di Apache di servire file statici.

Che cos'è un reverse proxy

Un reverse proxy recupera i contenuti per conto di un Client da uno o più Server. Molto semplicemente, è un Server che funge da tramite tra la richiesta HTTP del Client ed il Server dove è presente il contenuto richiesto. Un utilizzo tipico di questo sistema avviene quando abbiamo un'istanza Node JS che vive dietro un firewall. In un caso come questo, tutte le richieste HTTP verranno gestite dal server Apache il quale le reindirizzerà alla nostra istanza Node JS. In un meccanismo come questo, il client vedrà servirsi il contenuto come se provenisse dal server che agisce da proxy.

Scarica ed installa XAMPP sul tuo pc

Per iniziare abbiamo bisosno di installare un Server Apache sul nostr PC XAMPP. Se sei uno sviluppatore alle prime armi devi sapere che XAMPP è un ambiente di sviluppo web PHP che contiene più strumenti: Apache, MariaDB, PHP e Perl. Per verificare che sia tutto ok e che l'installazione sia avvenuta correttamente naviga fino alla cartella C:/xampp/htdcocs/ e crea al suo interno una cartella chiamata "test". A questo punto, all'interno di questa cartella, crea un nuovo file PHP (e.g. test.php) e incolla al suo interno il seguente codice:

Apri XAMPP e avvia il server Apache. Ora devi solo aprire il file che hai appena creato (test.php) con il tuo browser preferito. Per farlo, nella barra URL del tuo browser, naviga al percorso localhost/test/test.php. Se tutto è andato per il meglio dovresti vedere apparire la scritta "Hello World" all'interno del tuo browser. Per una guida approfondita su come installare XAMPP clicca qui.

Scarica e installa Node JS sul tuo PC

A questo punto, non ci resta che scaricare e installare sul nostro computer Node JS. Per farlo clicca qui e scarica la versione LTS. Segui l'installazione guidata ed al suo termine, per verificare che tutto sia stato configurato nel modo corretto, apri la barra di ricerca e digita cmd (su windows) o terminal (su Mac). A questo punto digita il comando node -v. Se l'installazione è stata eseguita correttamente, il terminale dovrebbe restituirti la versione di Node JS attualmente installata sul tuo computer. Per una guida approfondita su come installare Node JS clicca qui.

Configurazione dei file

A questo punto, nell cartella test crea tre nuovi file: index.html, main.html e server.js. Nel file index.html incolla il codice qui di seguito:

Nel file main.html incolla il codice qui di seguito:

Nel file server.js incolla il codice qui di seguito:

Lo scopo di questa guida è, oltre a spiegarti come attivare un reverse proxy, quello di farti capire il suo funzionamento. Apri un nuovo terminal e naviga alla cartella dove ospitiamo il nostro progetto: se hai VS Code non devi fare altro che aprire la cartella test che si trova al percorso "C:/xampp/test" ed all'interno di VS Code cliccare sulla tab terminal in alto e poi su nuovo terminal.

Se invece non sei provvisto di un editor di testo allora, dopo aver aperto un nuovo terminal, dovrai eseguire il comando cd .. fino a quando non sarai tornato alla root della partizione in cui hai installato xampp (i.e. C:\). A questo punto esegui cd xampp e poi cd test. Se tutto è stato fatto correttamente dovresti trovarti nel percorso C:/xampp/test. Per avviare il nostro server con Node non ci resta che eseguire il comando node server.js. A questo punto dovresti veder apparire la scritta "server avviato" all'interno del tuo terminal.

Ora apriamo due nuove schede all'interno del nostro browser. Nella prima navighiamo all'URL localhost/test/index.html, mentre nella seconda navighiamo all'URL localhost:3001. Vedremo due pagine html distinte, una servita con Apache mentre l'altra servita con Node. Nella scheda dove stiamo servendo la pagina con Apache proviamo a navigare all'URL localhost/test/test.php e poi all'URL localhost/test/main.html. Vedrete che con Apache stiamo servendo tutti i file presenti all'interno della cartella test. In questo momento sia Node che Apache si stanno comportando come due server distinti.

Abilitare la modalità Reverse Proxy su Apache (XAMPP)

Per prima cosa dirigiamoci nella cartella "C:/xampp/apache/conf/extra"/ e apriamo il file httpd-vhost. Ci ritroveremo di fronte un documento completamente commentato la cui funzionalità è quella di fornire le direttive a cui Apache si deve attenere in presenza di un Virtul Host. Apri il file e copia al fondo il seguente codice (Alla fine di questo esercizio ricordati di cancellare il codice che stai inserendo adesso altrimenti il tuo server Apache continuerà a comportarsi in modalità proxy):

A questo punto abbiamo dato tutte le direttive necessarie per far agire il nostro server Apache come una gateway e a questo punto non ci resta che riavvire il nostro server Apache. Ora dirigiti di nuovo sul tuo browser e naviga all'indirizzo "localhost/test", di default dovresti vedere la pagina statica servita con Node. Un'altra prova del fatto che ora il nostro server Apache è impostato in modalità proxy è data dal fatto che se navighiamo all'URL "localhost/test/index.html" oppure all'URL "localhost/test/test.php" vedremo sempre la stessa pagina statica servita dal nostro server Node JS. Congratulazioni, hai appena creato il tuo primo server in modalità reverse proxy.

Conclusioni

Questo metodo, soprattutto se utilizzato con Node in modalità Web Socket, può davvero rappresentare un'ottima configurazione da scalare in modo efficiente. Come sempre, noi siamo qui per assecondare le tue idee ed i tuoi progetti. Se hai bisogno di una consulenza gratuita per valutare la fattibilità di un tuo progetto web o vuoi automizzare processi aziendali utilizzando tutta la potenza del cloud clicca qui.