close
PHP

Jak uruchomić stronę z localhost na publicznym URL?

ngrok-widok

Jeśli pracujesz nad stroną lub aplikacją internetową, to często będziesz musiał uruchomić ją na publicznym serwerze. Możesz chcieć szybko pokazać komuś stronę lub po prostu część aplikacji nie będzie działać na serwerze lokalnym (bo komunikuje się z inną aplikacją, która wymaga publicznego URL). Co możesz w tym przypadku zrobić?

Mógłbyś kupić serwer i wrzucić tam wszystkie pliki przez FTP, ale to zazwyczaj zabiera sporo czasu. Tym bardziej, jeśli chcesz tylko coś przetestować i pliki za chwilę usuniesz. Dużo tutaj niepotrzebnej pracy.

Z pomocą przychodzi nam ngrok. Ngrok to bardzo proste narzędzie, które pozwala w kilka sekund uzyskać publiczny URL dla serwera lokalnego.

ngrok

Zacznijmy od pobrania ngrok. Przejdź na stronę pobierania i wybierz odpowiednią wersję dla swojego systemu operacyjnego. Jeśli korzystasz z Windowsa, to wypakuj pobrane archiwum. Znajdziesz w nim tylko jeden plik – ngrok.exe. Zanim przejdziemy do jego uruchomienia, stwórzmy testowy plik index.php:

Umieść go na swoim serwerze lokalnym w folderze test. Uruchom teraz wcześniej wypakowany plik ngrok.exe. W konsoli wpisz:

80 to port, na którym działa localhost. Jeśli korzystasz z innego (np. 8080), to koniecznie go podmień. W tym miejscu XAMPP, możesz podejrzeć port:

xampp port

Po wpisaniu komendy w konsoli naciśnij ENTER. Po udanym starcie serwera zobaczysz podobne okno:

ngrok start

Od teraz serwer lokalny jest dostępny pod adresem http://403fb6d4.ngrok.io (w Twoim przypadku będzie się różnił, przepisz z konsoli). W przeglądarce możesz teraz wpisać adres http://403fb6d4.ngrok.io/test i jeśli stworzyłeś wcześniej plik testowy, to zobaczysz słowo “test”.

Możesz zauważyć, że wygenerowany URL jest tak naprawdę zamiennikiem localhost. Dzięki temu możesz uruchamiać na publicznym serwerze dowolne aplikacji z serwera lokalnego.

Aktywność użytkowników na serwerze możesz podejrzeć w konsoli ngrok:

ngrok aktywność

Po zakończonych testach możesz w konsoli użyć skrótu Ctrl+C by wyłączyć serwer.

Tags : localhostngrok
  • spunky
  • janusz

    jak to cofnąć? jak zrobić, żeby ten program nie używał portu 80 ?

  • janusz

    Zrobiłem wszystko tak jak mówisz i teraz w ogóle nie działa mi localhost. Gdy uruchamiam uniserver dostaję informację, że port 80 jest używany przez inna aplikację i nic nie działa jak to naprawić?

  • Krzysiek Wąsowicz

    Jeśli ktoś szuka możliwości testowania strony na różnych urządzeniach w tej samej sieci, to polecam Gulpa, który przy okazji swojego normalnego działania generuje też external link ^^

    • Potwierdzam, Gulp jest super. W najbliższym czasie coś się o nim pojawi na blogu 🙂

      • Krzysiek Wąsowicz

        Oj myślę, że “coś” to zdecydowanie za mało o nim :p Aczkolwiek sam teraz bardziej myślę nad przenosinami na WebPacka, skoro React tak sie z nim lubi ^^

        • A może chciałbyś coś o Gulpie napisać na Devcorner? Jak myślisz? 🙂

          • Krzysiek Wąsowicz

            Głupie pytanie ^^

          • Krzysiek Wąsowicz

            Napisałem na facebook’u 😉

  • Grzegorz Topolewski

    Bardzo pomocne 🙂

  • Ile to się człowiek naszuka a tu proszę 🙂

  • Krzysztof Stańczuk

    Rewelacyjna, prosta instrukcja. dziękuję.