Aktifasi Https di Web Development

Aktifasi Https di Local Web Development

Hello sobat! Pernahkah kamu melakukan development di web project yang mengharuskan koneksi secured over https ketimbang http? Kalo belum, maka gunakan tips berikut ini untuk mengatasi trouble yang sering terjadi.

A. Keuntungan Pakai HTTPS

Berikut keuntungan utama menggunakan HTTPS dibanding HTTP biasa:


1. Keamanan Data (Encrypted)

Semua data yang dikirim dari client ke server dan sebaliknya terenkripsi, sehingga:

  • Tidak bisa dibaca oleh pihak ketiga (misalnya saat pakai WiFi publik).
  • Mencegah man-in-the-middle attack.

2. Kepercayaan Pengguna

Browser seperti Chrome, Firefox, Safari akan menampilkan indikator “Secure” atau gembok hijau di address bar.
Kalau masih HTTP, bahkan bisa muncul tulisan “Not Secure” yang bisa bikin user takut.


3. Syarat untuk Fitur Modern

Beberapa fitur web modern tidak bisa dipakai tanpa HTTPS, seperti:

  • Akses kamera dan mikrofon (getUserMedia),
  • Geolocation API,
  • Push Notification,
  • Service Worker dan PWA (Progressive Web App).

4. Lebih SEO Friendly

Google secara resmi menyatakan bahwa HTTPS adalah salah satu faktor ranking SEO.
Jadi web dengan HTTPS punya peluang lebih tinggi muncul di hasil pencarian.


5. Integrasi Payment dan Login Lebih Aman

Kalau sistem kamu pakai:

  • Form login,
  • Pembayaran,
  • Data penting lainnya…

…HTTPS adalah wajib! Bisa melindungi password, token, nomor kartu dari penyadapan.

Ngerti kan ya? Oke, lanjut…



B. Langkah Persiapan

Disini kita asumsikan nama domain dengan ip-address machine dimana web project itu berada ya, misalkan 192.168.0.4.

Kalau di PC kamu berbeda ip addressnya, ya pakai saja ip-address yang sesuai. Gunakan ipconfig di command prompt untuk mengetahui lebih lanjut.

Okay, get back to persiapan apa saja langkahnya? Yuk…

  1. Download cert-template.conf
  2. Download make-cert.bat
  3. Buka folder “C:/xampp/apache/” lalu buat folder cert
  4. Copy 2 file yang sudah didownload pada folder cert
  5. Buka make-cert.bat dan ikuti instruksinya
  6. Program akan otomatis menciptakan folder baru dengan certificate berdasarkan nama domain tadi.

ingat nama domainnya pakai IP-Address kita tadi! 192.168.0.4 lho! Okay setelah eksekusi tadi, Maka… Hasilnya harus begini yaa :

C. Langkah Penyetelan

  1. Buka file “C:/xampp/apache/conf/extra/httpd-vhosts.conf” dan lihat download vhosts.conf
  2. Buka file “C:\Windows\System32\drivers\etc\hosts” dan lihat contoh download host.
  3. Buka file “C:/xampp/apache/cert/domain.test/server.crt”, pilih Install Certificate -> Local Machine -> Place all certificates -> Trusted Root Certification Auhorities -> OK -> Next -> Finish
  4. Restart XAMMP atau bila perlu restart windows Anda.

D. Langkah Testing (Final)

Pakai device android/iphone yang sama satu wifi dengan project web development berada, lalu lanjutkan :

  • Akses ke browser chrome
  • ketik di url https://192.168.0.4
  • Tampilan warning abaikan lalu klik Advanced
  • Proceed (unsafe).
  • Selesai! Sekarang kita bisa pakai fitur Https secara normal!

Bisa ya kan? Ok good. Jika kalian butuh bantuan atau ingin penanganan langsung segerakan konsultasi bersama tim ahli kami disini!