Cara Mengakses Website di Localhost Melalui Jaringan LAN Menggunakan XAMPP di Windows

Jika kamu adalah seorang pengembang web yang menggunakan XAMPP di Windows untuk mengembangkan situs web di localhost, ada kalanya kamu in...

Jika kamu adalah seorang pengembang web yang menggunakan XAMPP di Windows untuk mengembangkan situs web di localhost, ada kalanya kamu ingin situs web tersebut dapat diakses oleh perangkat lain di jaringan lokal (LAN). Misalnya, kamu ingin kolega atau temanmu yang berada di jaringan yang sama dapat mengakses aplikasi web yang sedang kamu kembangkan.

Dalam artikel ini, saya akan membahas langkah-langkah yang dapat kamu ikuti untuk memungkinkan perangkat lain di jaringan LAN mengakses website yang berjalan di localhost kamu. Kita akan membahas cara mengatur XAMPP, melakukan perubahan pada konfigurasi Apache, memastikan firewall Windows mengizinkan akses, dan beberapa langkah lain yang relevan.

Berikut adalah panduan lengkapnya:


1. Apa Itu Localhost dan Bagaimana XAMPP Bekerja?

Sebelum kita masuk ke bagian teknis, mari kita pahami apa itu localhost dan bagaimana XAMPP berfungsi.

  • Localhost adalah istilah yang digunakan untuk merujuk ke komputer yang sedang digunakan. Ketika kamu menjalankan sebuah website di localhost, hanya komputer tersebut yang dapat mengakses website tersebut melalui browser dengan mengetikkan http://localhost atau http://127.0.0.1. Ini hanya bisa diakses dari komputer lokal.

  • XAMPP adalah software yang memudahkan pengembang web untuk menjalankan server lokal di komputer mereka. XAMPP adalah paket server yang berisi Apache (untuk menjalankan server web), MySQL atau MariaDB (untuk database), PHP (untuk scripting server-side), dan beberapa komponen lain.

Secara default, Apache di XAMPP hanya mendengarkan permintaan dari localhost. Namun, dengan sedikit pengaturan, kita bisa mengubah ini agar web server kita dapat diakses oleh perangkat lain melalui jaringan LAN.


2. Mengapa Perlu Mengakses Localhost dari Jaringan LAN?

Ada banyak alasan mengapa kita mungkin ingin membuat website di localhost bisa diakses melalui jaringan LAN, beberapa di antaranya adalah:

  • Kolaborasi dengan Tim: Kamu bisa berbagi progress project web yang kamu kerjakan dengan rekan satu tim, sehingga mereka bisa melihat, menguji, atau memberikan masukan secara real-time tanpa perlu memindahkan aplikasi ke server yang berbeda.

  • Testing pada Perangkat Berbeda: Saat mengembangkan aplikasi web, kamu mungkin ingin menguji aplikasi tersebut pada perangkat lain, seperti smartphone, tablet, atau komputer lain di jaringan LAN. Ini membantu memastikan kompatibilitas dan responsivitas pada berbagai perangkat.

  • Demo untuk Klien: Jika kamu sedang melakukan pengembangan aplikasi web untuk klien, kamu bisa mendemonstrasikan hasil kerja kamu secara langsung melalui jaringan LAN tanpa harus mengupload aplikasi ke server eksternal.

Dengan alasan-alasan tersebut, mengetahui cara mengkonfigurasi web di localhost agar bisa diakses melalui jaringan LAN adalah keterampilan yang sangat bermanfaat.


3. Langkah-langkah Mengonfigurasi XAMPP untuk Akses LAN

Berikut adalah langkah-langkah yang perlu kamu ikuti agar website yang berjalan di localhost bisa diakses oleh pengguna lain di jaringan LAN.

Langkah 1: Cari IP Address Komputer Kamu

Langkah pertama adalah menemukan IP address komputer yang menjalankan server XAMPP. IP address ini yang akan digunakan oleh perangkat lain untuk mengakses server lokalmu. Berikut cara menemukannya:

  • Windows:

    1. Tekan Win + R di keyboard, ketikkan cmd, lalu tekan Enter untuk membuka Command Prompt.
    2. Di Command Prompt, ketikkan perintah berikut:

      ipconfig
      
    3. Kamu akan melihat beberapa informasi jaringan. Cari IPv4 Address di bagian koneksi jaringan yang aktif (bisa Ethernet atau Wi-Fi tergantung bagaimana komputermu terhubung ke jaringan). Misalnya, IP-nya adalah 192.168.1.10. Ini adalah alamat yang akan digunakan oleh perangkat lain di jaringan untuk mengakses website kamu.

Langkah 2: Ubah Konfigurasi Apache di XAMPP

Agar website di localhost dapat diakses melalui jaringan LAN, kita perlu melakukan beberapa perubahan pada pengaturan Apache. Berikut adalah langkah-langkahnya:

  1. Buka File Konfigurasi Apache:

    • Di XAMPP, file konfigurasi Apache bernama httpd.conf. Lokasi default file ini adalah:
      C:\xampp\apache\conf\httpd.conf
      
    • Buka file ini menggunakan editor teks seperti Notepad atau Notepad++.
  2. Ubah Pengaturan Listen:

    • Cari baris yang berisi:

      Listen 80
      
    • Secara default, baris ini hanya membuat Apache mendengarkan di localhost. Untuk mengizinkan akses dari jaringan LAN, ubah menjadi:

      Listen 0.0.0.0:80
      

      Ini memungkinkan Apache mendengarkan semua permintaan dari IP manapun, termasuk dari jaringan LAN. Kamu juga bisa menggantinya secara spesifik dengan IP address komputer kamu, seperti ini:

      Listen 192.168.1.10:80
      
  3. Ubah Pengaturan ServerName:

    • Cari baris yang berisi:

      ServerName localhost:80
      
    • Ubah menjadi:

      ServerName 192.168.1.10:80
      
  4. Simpan Perubahan dan Restart Apache:

    • Setelah melakukan perubahan, simpan file tersebut dan restart Apache melalui XAMPP Control Panel. Klik tombol Stop pada Apache, lalu klik Start kembali.

Langkah 3: Konfigurasi Firewall Windows

Windows Firewall biasanya memblokir permintaan yang datang dari luar jaringan, termasuk akses dari perangkat lain di jaringan LAN. Jadi, kita perlu mengatur Firewall agar mengizinkan akses ke port 80 (port default HTTP) untuk Apache. Berikut caranya:

  1. Buka Control Panel > System and Security > Windows Defender Firewall > Advanced settings.
  2. Klik Inbound Rules di panel kiri, lalu klik New Rule di panel kanan.
  3. Pilih Port, kemudian klik Next.
  4. Pilih TCP, dan masukkan 80 di kolom port, lalu klik Next.
  5. Pilih Allow the connection, lalu klik Next.
  6. Pilih semua profil (Domain, Private, Public), kemudian klik Next.
  7. Beri nama rule ini, misalnya "Apache Port 80", lalu klik Finish.

Dengan demikian, Windows Firewall akan mengizinkan koneksi ke Apache melalui port 80 dari perangkat di jaringan LAN.

Langkah 4: Akses Website dari Perangkat Lain di Jaringan LAN

Setelah semua pengaturan dilakukan, kamu sekarang bisa mengakses website yang berjalan di localhost dari perangkat lain di jaringan LAN. Caranya adalah dengan mengetikkan IP address komputer server di browser perangkat lain, misalnya:

http://192.168.1.10

Jika kamu menggunakan port selain 80 (misalnya 8080), kamu perlu menyertakan nomor port dalam URL, seperti ini:

http://192.168.1.10:8080

Sekarang, website yang berjalan di XAMPP dapat diakses oleh perangkat lain di jaringan LAN, baik itu komputer, smartphone, atau tablet.


4. Troubleshooting Umum

Jika setelah mengikuti langkah-langkah di atas website di localhost kamu masih belum bisa diakses dari perangkat lain, coba cek beberapa hal berikut:

  • Cek IP Address: Pastikan IP address yang kamu gunakan adalah IP yang benar dari komputer server.
  • Cek Firewall: Pastikan firewall tidak memblokir port yang digunakan oleh Apache.
  • Cek Koneksi Jaringan: Pastikan semua perangkat terhubung ke jaringan LAN yang sama.
  • Cek Status Apache: Pastikan Apache di XAMPP berjalan tanpa error.

5. Kesimpulan

Mengakses website di localhost melalui jaringan LAN menggunakan XAMPP di Windows bisa sangat berguna dalam situasi kolaboratif atau saat menguji aplikasi web di perangkat lain. Dengan mengikuti langkah-langkah di atas, kamu bisa dengan mudah mengkonfigurasi server Apache di XAMPP agar bisa diakses oleh perangkat lain melalui jaringan LAN. Pastikan kamu mengikuti setiap langkah dengan hati-hati, terutama yang berkaitan dengan pengaturan firewall dan konfigurasi Apache.

Dengan konfigurasi yang benar, kamu bisa membagikan website yang berjalan di localhost dengan pengguna lain tanpa perlu menguploadnya ke server online terlebih dahulu, yang dapat menghemat waktu dan memberikan fleksibilitas lebih dalam pengembangan aplikasi web.

COMMENTS

Nama

2fa,2,adsense,3,ai,28,Alat,1,Algorithms,3,Android,28,anti virus,1,Apache,4,api,3,Aplikasi Android,10,apps,2,AppSheet,36,arang,1,Array,3,array formula,2,Artikel,8,bca,1,Belajar,1,Bengkak,1,Berita,1,Berita terkini,9,Biografi,1,Bisnis,139,Bitcoin,1,Blog,8,Blogger,35,Blogger Template,1,Blogging,2,Bootable,1,bot,1,build with syahdandev,4,bun.js,1,catlang,1,chat gpt,1,Cheat,1,Chrome,2,Code,14,coding,11,collaboration tools,1,Competitive Coding,7,CPU,1,Crud,1,CSS3,2,cybersecurity,2,Data Structures,18,Database,1,Deep Learning,3,Desain Blogger,47,Design,3,developer,5,Development,8,Domain Hosting,2,Download,4,dunia kerja,2,Elon Musk,4,enak,1,express,1,Facebook,2,fact or hoax,1,fastify,1,free,1,Free Course,13,Game,5,Gamers,2,gemini,1,generate with AI,1,github,1,google,12,Google AdSense,20,Google Apps Script,18,google calendar,1,google docs,2,google drive,2,google forms,1,google mail,1,google maps,1,Google Script,3,google sheets,5,Google Webmaster Tools,1,Hardware,1,Home,1,hosting,4,Hostinger,1,HP,2,HTML,6,HTML5,2,ice cream,1,ide kreatif,2,image creator,2,Indonesia,1,Instagram,2,instant vdeo generator,1,integrator,1,Internet,8,iOS,1,IOT,2,IT,6,JavaScript,6,js,4,Kenali,1,Keren,1,Kesehatan,14,laragon,1,laravel,1,Leet Code,7,Linked List,4,Linux,8,Machine Learning,3,malware,1,map,1,Mark Zuck,1,Marketing Tools,1,marketplace,1,Mata,1,Math,8,mbti,2,McDonald's,1,meme,1,meta,1,mfa,1,Microsoft Word,1,Minimalis,1,miscellaneous questions,1,mixue,1,Mobile Legends,4,Motherboard,1,motivasi,1,murah,1,mysql,3,Neovim,1,Networking,1,next js,1,ngingx,1,NIK,1,no code,5,node js,9,nodejs,1,NPWP,1,Office,1,open ai,1,Oppo,1,Parallel Space,1,pc,2,pgsql,2,Phoenix OS,1,PHP,15,phpmyadmin,2,portofolio,1,postman,3,Power Point,1,Presentation,1,price list,1,Program Aplikasi,6,programmer,3,programming,1,psikolog,4,python,4,Quesions or Answers (Quora),2,Questions or Answers (Quora),1,RAR,2,Recursion,3,regex,2,Regulasi,1,Review,147,Rufus,1,Rumus,55,Sakit,1,Samsung,1,Security,1,SEO,21,SHAREit,1,shop,1,simple apps,1,Smart City,1,smartfren,1,Smartphone,1,sms,1,Social Media,1,socket.io,2,Software,2,spesifikasi,1,SQL,1,SQL Server,1,Steemit,7,string,3,team IT,1,Tebak Gambar,2,Technology,4,Teknologi,8,Teknologi Informasi,3,Telegram,3,Template Blog SEO,10,Template Blogger,2,Templates,1,terminal,1,tiktok,1,Tips,22,Tips & Trik,19,Tips Blogging,36,Tips SEO,23,toolkit,1,Tree,8,Trick,27,trik,3,Tulisan Lepas,1,tutorial,6,Tutorial CSS,3,Tutorial HTML,56,Tutorial JavaScript,3,Twitter,2,Ubuntu,5,udemy,7,UX,8,VirtualBox,1,VLC Media Player,1,VSCode,2,waconsole,18,wallpaper engine,1,web dev,2,Web Server,5,WhatsApp,14,WhatsApp Gateway,6,Widget,2,Windows,25,wordpress,4,XAMPP,7,Xiaomi,4,Yii2,1,YouTube,3,
ltr
item
Syahdan Dev Blog: Cara Mengakses Website di Localhost Melalui Jaringan LAN Menggunakan XAMPP di Windows
Cara Mengakses Website di Localhost Melalui Jaringan LAN Menggunakan XAMPP di Windows
https://blogger.googleusercontent.com/img/a/AVvXsEjUJrcuAKbnK-f8yuh6Kq-CNQFKN3Shl0q3PxJQxsTkKcKO2orbEsRaFUcX3sdSzlY4JIE4U1DjfIHK5nRZ9-NgV2D8JZJ5PprnpS90fFriAG7FqYdN-oVWYSX7CSQh4cCTAOrNiBlALja6B3JS08y2vCn2KCsOwcz3at6PANqzj8WEYIb_e4ttPMHqmZ4
https://blogger.googleusercontent.com/img/a/AVvXsEjUJrcuAKbnK-f8yuh6Kq-CNQFKN3Shl0q3PxJQxsTkKcKO2orbEsRaFUcX3sdSzlY4JIE4U1DjfIHK5nRZ9-NgV2D8JZJ5PprnpS90fFriAG7FqYdN-oVWYSX7CSQh4cCTAOrNiBlALja6B3JS08y2vCn2KCsOwcz3at6PANqzj8WEYIb_e4ttPMHqmZ4=s72-c
Syahdan Dev Blog
https://syahdandev.blogspot.com/2024/09/cara-mengakses-website-di-localhost.html
https://syahdandev.blogspot.com/
https://syahdandev.blogspot.com/
https://syahdandev.blogspot.com/2024/09/cara-mengakses-website-di-localhost.html
true
6341435550051226882
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy Table of Content