Ngrok Pubblica il tuo sito in localhost
Lo sviluppo di siti e di Webb Application e’, al giorno d’oggi, uno dei core business piu’ importanti per la maggior parte delle aziende in tutto il mondo, motivo per cui sono nati una grande quantita’ di tool per agevolare i web developer durante tutte le operazioni di sviluppo, test e produzione.
Molto spesso capita che non si abbia il tempo o anche il budget per gestire piu’ ambienti di sviluppo, cosi ci si riduce per avere tutto il proprio ambiente [sviluppo / test / pre produzione] soltanto sul proprio pc.
Come fare quindi se c’e’ bisogno di mostrare l’avanzamento del lavoro al cliente senza dover prima creare e/o aggiornare gli altri ambienti di test/pre-produzione??? …. e’ per aiutare in questa pressante fase che e’ nato un tool come ngrok.
Ngrok e’ un reverse proxy server con cui e’ possibile rendere “pubblico” un server locale, anche se e’ collocato dietro un NAT od un Firewall, il tutto tramite secure tunnel. Quindi attraverso Ngrok si potra’ implementare un personal cloud service direttamente dalla propria postazione di lavoro realizzando cosi uno stack LAMP/LEMP
INSTALLAZIONE
mkdir ngrok
cd ngrok/
wget -c https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip
unzip ngrok-stable-linux-amd64.zipDopo aver installato il pacchetto possiamo fare una prova, se ad esempio usate come web server Apache, potete farlo in questo modo;
sudo nano /var/www/html/index.html
<!DOCTYPE html> <html> <body> <h1>Prova</h1> <p>Test di Ngrock.</p> </body> </html>Salviamo il file e ora possiamo avviare il tool puntandolo sulla porta su cui abbiamo in ascolto il nostro Web server:
ngrok http 80Una volta lanciato il comando ci apparira’ qualcosa di simile:
Session Status online Session Expires 7 hours, 53 minutes Version 2.2.8 Region United States (us) Web Interface http://127.0.0.1:4040 Forwarding http://44c9afca.ngrok.io -> localhost:80 Forwarding https://44c9afca.ngrok.io -> localhost:80
Una volta avviato possiamo dunque iniziare ad usarlo anche tramite la comoda interfaccia Web:
http://localhost:4040
Tornando alla descrizione del Tunnel appena creato, le voci a cui dobbiamo fare caso sono:
- Web Interface: tramite questo indirizzo potrai accedere ad un’interfaccia web dove puoi monitorare tutte le attività associate all’url che hai appena creato. Questo vuol dire che potrai vedere quanti utenti si stanno collegando ed altre informazioni.
- Forwarding: questo è il link che dovrai fornire al tuo cliente. Hai entrambe le versioni, sia http che https. Lavorando in locale probabilmente userai quasi sempre l’http.
- HTTP Requests: In questa sezione vedrai in tempo reale tutte le richieste http che vengono fatte tramite il tuo link. Ti è utile per capire se qualcuno sta guardando il sito in un dato momento.
Quindi dando al proprio cliente il link http://44c9afca.ngrok.io quest’ultimo avra’ accesso alla root web del localhost
Questo vuol dire che se stai utilizzando MAMP o XAMPP verrà servito il file index.php all’interno della tua cartella /htdocs
Se invece utilizzi WAMP su Windows il tuo tunnel porterà gli utenti alla index.php della cartella www
Per coloro che utilizzano un Virtual Host per gestire i tuoi progetti la procedura e’
leggermente diversa ma pur sempre semplice; nella pratica bastera’ aggiungere un solo
parametro, come nell’esempio seguente:
ngrok http -host-header=miosito.dev 80dove ovviamente al posto di “miosito.dev” metterete l’indirizzo del vostro in locale. ** WordPress per coloro che invece usano la piattaforma di WordPress si dovranno applicare altri accorgimenti per far in modo che il vostro cliente veda correttamente il sito. Questo perche’ tutti gli url che creati da WordPress sono assoluti ovvero mostrano per esteso l’indirizzo di un determinato documento. Per poter effettuare questo tipo di modifica consiglio di utilizzare un comodo tool come Relative URL , un tool che fa gia parte dei plugin consigliati da WordPress, con il quale sara’ possibile modificare URL da qualcosa come questo (esempio):
http://localhost:8080/wp/2012/09/01/hello-world/
in qualcos’altro come questo:
/wp/2012/09/01/hello-world/Una volta effettuate tutte le modifiche del caso bisognera’ aggiornare il file wp-config.php
inserendo, prima della riga “/* i parametri dei re indirizzamenti, qualcosa del tipo:
define('WP_SITEURL', 'http://' . $_SERVER['HTTP_HOST']);
define('WP_HOME', 'http://' . $_SERVER['HTTP_HOST']);
PS:Ricordatevi di disinstallare il plugin e rimuovere le righe di codice dal file wp-config.php quando metterete il sito online.
Le configurazioni possibili con Ngrok sono davvero svariate e potete trovare tutto cio che non e’ stato contemplato in questo articolo, direttamente sul sito del progetto NGROK
Tutti per Linux 