Cara Akses Web Localhost dari Perangkat Lain Dalam Satu Jaringan LAN / Wireless


Pagi ini saya ingin berbasi seputar tips membangun website local dimana website ini dapat diakses oleh pengguna yang terhubung dalam satu jaringan yang sama, mau itu LAN ataupun Wireless (HotSpot)

Baiklah, saya asumsikan disini teman-teman sudah mengerti cara instalasi xampp web server dan sudah mengerti dimana meletakkan folder aplikasi pada web server local.

Pada pembahasan kali ini hanya akan difokuskan untuk bagaimana mengakses web local dari perangkat lain, antara lain:

  • Bagaimana mengakses web local dari Laptop yang terhubung dalam satu jaringan menggunakan HotSpot.
  • Bagaimana mengakses web local dari PC yang terhubung dalam satu jaringan menggunakan LAN.
  • Bagaimana mengakses web local dari Smartphone (Android, iOS, Windows Phone, dll) dalam satu jaringan menggunakan HotSpot.

Hal Pertama Yang Perlu Dilakukan adalah mengatur IP Server dan IP Client

Tujuannya adalah untuk menyambungkan / mengintegrasikan antar PC Server dan PC Client, maksud PC Server disini adalah PC/Komputer/Laptop yang terinstall Web Server (Xampp) dimana aplikasi web terinstall.

Sedangkan PC Client adalah PC yang digunakan untuk mengakses web local dari Web Server local yang terpasang pada PC Server.

Sudah mengerti sampai disini? Selanjutnya kita akan lakukan Konfigurasi IP, Perhatikan langkah-langkah berikut:

  • Pada PC Server kita atur IP-nya 192.168.0.199
  • pada PC Client kita atur IP-nya 192.168.0.1 – 192.168.0.225, sesuaikan saja dengan kebutuhan pada studi kasus ini saya memiliki 20 PC Client jadi saya setting IP Clientnya dengan range 192.168.0.1 – 192.168.0.20 , perhatikan gambar berikut

Hal Kedua kita perlu setting sedikit konfigurasi pada XAMPP (Web Server)

Buka file httpd.conf di folder C:/xampp/apache/conf/httpd.conf

edit file di notepad++ atau VSCode
Edit Pada Baris 183 hilangkan tanda pagar/hastagnya, lalu Save

 

Selanjutnya, Mari kita Uji Coba jalankan Aplikasi Web Localhost di PC Server

Pertama, Buka dulu Xampp Control Panelnya dan Start Servis Apache dan MySQLnya

Kedua, Buka Browser dan akses situs web yang ada di localhost, pada contoh kasus ini saya akan menjalankan Aplikasi TryOut yang sudah saya install di localhost dengan mengakses “http://localhost/nama-aplikasi/

http://localhost/to-admin/

nama folder digunakan untuk mengakses url dilocahost
akses web di localhost dari PC Server

Disini saya saya Login Aplikasi Sebagai Admin, ini hanya contoh saja, terserah kalian mau login sebagai apa diaplikasi kalian, tergantung studi kasus temann-teman. intinya disini saya menjelaskan bagaimana cara ini bekerja, oke lanjut berikut tampilan aplikasi yang sudah terinstall di locahost.

Selanjutnya, kita akan mengakses web local dari PC Client

Perlu dicatat, pada PC Client kita tidak perlu menginstall Web Server / Xampp, karena kita hanya perlu mengakses web yang berada pada localhost melalui Alamat IP yang sudah kita atur sebelumnya pada PC Server.

Dalam contoh kasus ini saya menggunakan IP pada PC Server 192.168.0.199, Maka cara mengakses web localhost dari PC Client kita hanya perlu mengakses IP Server tersebut diikuti dengan Port http 80 pada Browser kita. Jadi cara mengaksesnya adalah dengan mengetik http://192.168.0.199:80/nama-aplikasi/, atau pada contoh ini saya akses http://192.168.0.199:80/to-students/, Perhatikan pada gambar berikut

Akses Web di localhost pada PC Client

Maka website yang terpasang pada PC Server sudah berhasil diakses melalui PC Client. Untuk percobaan akses web localhost dari smartphone sama saja caranya, akses IP Adress dengan port 80 dan nama aplikasinya “http://ip-address:80/nama-aplikasi“.

Bagaimana? Cukup mudah bukan? ^_^

Demikianlah cara mengakses web localhost dari perangkat lain.

Semoga bermanfaat, dan terima kasih sudah berkunjung ^_^

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.