Salah satu kesulitan kita sebagai pengembang website dan para web master adalah ketika mengembangkan website yang menggunakan CMS dengan alamat URL absolute. Seperti misalnya Joomla. Dalam kasus Joomla, kita akan mengalami kesulitan saat memindahkan database dan instalasi Joomla yang telah kita develop di localhost kita ke server yang sebenarnya. Masalah utamanya sebenarnya adalah pada domain URL absolut tersebut.
Lalu bagaimana kita membuat domain sendiri di localhost kita?
Virtual host adalah salah satu fitur di Apache, salah satu komponen XAMPP, yang memungkinkan kita punya beberapa hosting website di satu web server di mana masing-masing punya nama domain sendiri, misalnya http://www.abc.com dan http://www.xyz.com. Apache punya dua jenis virtual host, yaitu NameVirtualHost dan IP-Based Virtual Host. Dalam artikel ini cuma kan dibahas NameVirtualHost.
Proses Membuka Halaman Website
Sebelum kita bahas bagaimana caranya mengkonfigurasi NameVirtualHost, ada baiknya kita pahami dulu proses yang terjadi ketika kita membuka suatu halaman website.
Pada saat kita mengetikan alamat suatu website (URL, Universal Resource Locator) di web browser kita, misalnya http://www.abc.com/artikel/index.php, maka web browser memecah URL tersebut menjadi beberapa komponen. Komponen dari URL di atas adalah:
- Protokol, (dalam contoh ini adalah http), bagian ini menentukan cara komputer kita berkomunikasi dengan server. Dalam hal ini menggunakan protokol HTTP.
- Host Name, (www.abc.com), bagian ini digunakan untuk mencari lokasi webserver.
- Lokasi relatif dokumen (/artikel/index.php), bagian ini menentukan lokasi dokumen dalam webserver yang akan kita buka.
Selanjutnya komputer kita akan menterjemahkan nama host menjadi IP address. Hal ini dilakukan karena komputer berkomunikasi dengan menggunakan IP address, bukan nama host. Proses penerjemahan ini disebut name resolution process. Proses ini dilakukan dengan cara:
- Melihat local cache. Mungkin saja nama host tersebut pernah diterjemahkan menjadi IP address dalam proses sebelumnya.
- Melihat ‘hosts’ file. File ini berisi pemetaan nama host dengan IP address.
- Mencari di DNS server. DNS server memiliki database yang memuat pemetaan nama host dengan IP address.
Setelah IP address diketahui, komputer akan mengontak web server dan meminta dokumen yang kita minta dengan menggunakan lokasi relatif dokumen dari URL. Jika dokumen yang kita minta berhasil ditemukan oleh web server, maka web server akan memberikan dokumen tersebut, dan komputer kita akan menampilkannya di web browser.
Kalau digambarkan, proses yang terjadi kurang-lebih adalah seperti ini:
Modifikasi Name Resolution Process
Agar kita bisa menggunakan NameVirtualHost, kita harus mengkonfigurasi name resolution process terlebih dahulu. Untuk melakukannya, kita bisa mengedit hosts file atau mengkonfigurasi DNS. Dalam artikel kali, modifikasi name resolution process hanya akan dilakukan dengan mengedit hosts file. Hosts file adalah file teks yang berisi pemetaan nama host dengan IP address. Kita bisa mengedit file ini dengan menggunakan notepad. Lokasi hosts file adalah C:WINDOWSsystem32driversetchosts.
Di dalam hosts file (yang belum diubah) seharusnya sudah ada satu record, yaitu:
[html]127.0.0.1 localhost[/html]
Bagian kiri adalah IP address dan bagian kanan adalah nama host-nya. Arti dari record di atas adalah kalau komputer mau melakukan koneksi dengan komputer yang nama hostnya localhost, komputer akan mencari komputer dengan IP address 127.0.0.1.
Catatan: 127.0.0.1 adalah IP address komputer kita sendiri, disebut loopback. Semua komputer memiliki IP address ini untuk keperluan berkomunikasi dengan dirinya sendiri.
Coba tambahkan baris berikut:
[html]127.0.0.1 www.abc.com
127.0.0.1 www.xyz.com[/html]
Setelah itu start XAMPP lalu buka web browser, browse http://www.abc.com dan http://www.xyz.com. Apa yang terjadi? Seharusnya kita akan melihat halaman website yang kita simpan di XAMPP. Kalau sudah berhasil, kita bisa lanjutkan ke pembahasan berikutnya.
Konfigurasi NameVirtualHost
Untuk mengoonfigurasi NameVirtualHost kita harus edit file httpd-vhost.conf di dalam folder xamppapacheconfextra. Kita bisa edit file ini dengan menggunakan notepad. Di dalam file itu sudah ada contoh konfigurasi, tapi masih berupa comment (diabaikan oleh apache, karena masih ada tanda pagar (#) didepan teks).
Untuk bisa menggunakan NameVirtualHost, langkah pertama yang harus kita lakukan adalah menghapus tanda pagar (#) di depan tulisan ##NameVirtualHost *:80. Setelah itu tambahkan definisi NameVirtualHost untuk setiap nama host (domain) yang kita buat. Contoh untuk membuat NameVirtualHost http://www.abc.com dan http://www.xyz.com, tambahkan baris berikut:
[html]ServerAdmin www.abc.com
DocumentRoot "D:/xampp/htdocs/abc"
ServerName www.abc.com
ServerAlias *.abc.com
ServerAdmin www.xyz.com
DocumentRoot "D:/xampp/htdocs/xyz"
ServerName www.xyz.com
ServerAlias *.xyz.com[/html]
Modifikasi teks di atas sesuai dengan keperluan. Ada beberapa hal yang haru diperhatikan, yaitu:
- DocumetRoot hanya bisa diisi dengan link relatif ke folder di bawah folder XAMPP. Biasanya dokumen website disimpan di folder htdocs.
- ServerAlias bisa menggunakan asterix (*), contoh: *.xyz.com. Artinya setiap nama host yang diakhiri xyz.com akan di-redirect ke folder /xampp/htdocs/xyz.
- Restart Apache setiap kali melakukan perubahan konfigursi VirtualHost.
Contoh Kasus
Kita ingin membuat nama domain & alamat IP yang berbeda untuk dua web kita di XAMPP. Misalnya 127.0.0.2 untuk www.abc.com dengan root folder xampphtdocsabc, dan 172.0.0.3 untuk www.xyz.com dengan root folder xampphtdocsxyz, dengan asumsi bahwa telah ada folder bernama abc dan xyz dalam htdocs. Maka yang harus kita lakukan adalah:
Mengkonfigurasi file httpd-vhosts.conf
Tambahkan baris:
[html]ServerAdmin www.abc.com
DocumentRoot "D:/xampp/htdocs/abc"
ServerName www.abc.com
ServerAlias *.abc.com
ServerAdmin www.xyz.com
DocumentRoot "D:/xampp/htdocs/xyz"
ServerName www.xyz.com
ServerAlias *.xyz.com[/html]
Dalam contoh diatas, saya menginstall XAMPP di D:
Setiap setelah melakukan konfigurasi, restart Apache.
Mengonfigurasi file hosts
Tambahkan baris:
[html]127.0.0.2 www.abc.com
127.0.0.3 www.xyz.com[/html]
Setelah itu simpan.
Testing…testing…
Buka browser dan ketikkan http://www.abc.com dan http://www.xyz.com. Kalaun teman-teman benar mengkonfigurasi seperti diatas tadi, seharusnya ketika teman-teman mengetikkan http://www.abc.com dan http://www.xyz.com di address bar browser, maka browser akan mengarah ke root folder yang tertulis di DocumentRoot dalam file httpd-vhosts.conf.