Beberapa hari yang lalu saya penasaran dengan yang namanya WebRTC, saya mencoba untuk membuat aplikasi "Online Meeting" dengan menggunakan teknologi tersebut. Masalah muncul ketika saya sedang mencoba untuk mendapatkan akses ke video, microphone dan share screen dari komputer saya dari javascript. Ternyata untuk dapat mendapatkan hak akses ke permission tersebut jika kita tidak menggunakan localhost, harus menggunakan protokol HTTPS, tidak bisa hanya menggunakan protokol HTTP, meskipun website yang coba kita akses masih dalam satu jaringan lokal.
Salah satu solusi yang saya pertama kali coba adalah dengan menggunakan tunneling dari Cloudflare Zero Trust. Cara pemakaiannya pun cukup mudah, tanpa login ke akun Cloudflare, cukup mengunduh binary dan menjalankannya melalui terminal. Namun, menurut saya cara ini kurang optimal karena request dan response harus di forward ke network Cloudflare terlebih dahulu.
Solusi selanjutnya adalah langsung membuat web server https di perangkat lokal saya.
Protokol HTTP dan HTTPS
Hypertext Transfer Protocol atau HTTP adalah protokol transfer data yang digunakan untuk bertukar informasi yang digunakan untuk World Wide Web. Sedangkan HTTPS adalah varian dari protokol HTTP yang menambahkan enkripsi dalam proses pertukaran data tersebut, sehingga data yang sedang di transfer dapat diverifikasi keabsahannya.
Untuk dapat menggunakan protokol HTTPS pada website kita di internet, kita dapat membeli Sertifikat SSL dari penyedia seperti Let'sEncrypt atau Comodo. Ada juga Cloudflare yang menyediakan SSL gratis untuk situs yang menggunakan layanan mereka.
Self-Signed Certificate
Sertifikat SSL pada umumnya harus ditanda tangani (secara digital) oleh penyedia terpercaya (seperti yang saya sebutkan di atas). Namun, kita juga dapat membuat sertifikat SSL yang kita tanda tangani sendiri. Tetapi, ketika kita mengakses website yang menggunakan sertifikat yang ditanda tangani sendiri tersebut, akan memunculkan pesan error bahwa sertifikat tidak dipercaya.
Karena kita hanya akan menggunakan sertifikat ini untuk keperluan lokal, kita dapat memasang sertifikat yang kita buat tersebut di device yang kita gunakan agar dianggap sebagai sertifikat yang dipercaya.
Membuat Self-Signed Certificate
Di UNIX (Linux dan Mac) kita dapat menggunakan tools cli OpenSSL untuk membuat sertifikat. Jalankan perintah di bawah ini untuk membuat sertifikat secara interaktif:
openssl req -x509 -newkey rsa:4096 \
-keyout localhost.key \
-out localhost.pem \
-sha256 \
-days 365
Dari perintah di atas kita akan menyimpan sertifikat (publik) ke file localhost.pem
dan private key (semacam kode rahasia yang digunakan untuk memverifikasi pemilik asli sertifikat yang dibuat) ke dalam file localhost.key
. Dalam perintah di atas kita juga mengatur waktu valid sertifikat menjadi 1 tahun (365 hari).
Ketika Anda menjalankan perintah di atas akan ditanya beberapa hal seperti passphrase, negara, provinsi dan pertanyaan lainnya (yang sebenarnya bisa Anda isi apa saja). Yang perlu diperhatikan adalah ketika ditanya Common Name, silakan diisi dengan hostname yang Anda gunakan, bisa localhost atau nama host custom yang Anda gunakan.
Misalnya saja di rumah saya menggunakan router ZTE F609 yang secara otomatis DNS resolver-nya mengatur agar hostname PC saya dapat diakses oleh device lain dalam satu jaringan. Saya mengatur hostname PC saya "hasan-pc" dan saya dapat mengakses PC saya dari device lain dengan URL "http://hasan-pc.local" maka di Common Name saya isikan "hasan-pc.local"
Ketika selesai Anda akan mendapatkan file localhost.key
dan localhost.pem
(atau sesuai perintah yang Anda masukan) di folder saat ini. File .pem
dan .key
tersebut dapat digunakan untuk web server lokal kita.
Contoh Penggunaan
Untuk cara penggunaan sertifikat tersebut sangatlah beragam sesuai dengan cara Anda membuat server lokal tersebut. Misalnya saja jika menggunakan Go, Anda dapat menggunakan fungsi ListenAndServeTLS
:
sslCertPath := os.Getenv("SSL_CERT_PATH")
sslKeyPath := os.Getenv("SSL_KEY_PATH")
err := http.ListenAndServeTLS(":8081", sslCertPath, sslKeyPath, r)
if err != nil {
log.Fatalln("Failed to listen in port 8081!")
}
Jika Anda menggunakan framework frontend dan vite, Anda dapat mengubah konfigurasi vite agar melakukan serve ke https:
import { defineConfig, loadEnv } from "vite";
import react from "@vitejs/plugin-react-swc";
// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
const env = loadEnv(mode, process.cwd(), "SSL_");
return {
plugins: [react()],
server: {
host: true,
port: 443,
https:
env.SSL_CERT_PATH && env.SSL_KEY_PATH
? {
key: env.SSL_KEY_PATH,
cert: env.SSL_CERT_PATH,
}
: undefined,
},
};
});
Pada contoh di atas saya memasukkan path dari sertifikat dan key ke dalam file .env. Jika Anda menggunakan Apache atau NGINX, sertifikat ini dapat diatur dalam file konfigurasinya.
Memasang Sertifikat Pada Device
Seperti yang saya sebutkan sebelumnya, browser akan menampilkan pesan error jika sertifikat yang digunakan oleh suatu website tidak dikenali. Kita perlu memasang sertifikat yang telah kita buat pada device kita. Saya menggunakan fedora, untuk memasang sertifikat ke sistem caranya cukup mudah:
sudo cp localhost.pem /etc/pki/ca-trust/source/anchors/
sudo update-ca-trust extract
Setelah itu terkadang Anda perlu melakukan reboot agar sertifikat dikenali. Bagi pengguna sistem operasi lain seperti Mac, Ubuntu ataupun Windows dapat mencari cara di internet bagaimana cara memasang trusted certificate.
Bagi pengguna android, Anda dapat mencari pengaturan CA Certificate, lalu memilih file sertifikat .pem
yang akan dipasang.
Selanjutnya, coba akses web yang sudah Anda pasang sertifikatnya pada device tersebut. Hasilnya Anda tidak akan mendapatkan pesan error lagi.
Kesimpulan
Pembuatan Self-Signed Certificate (pada perangkat Unix) sebenarnya cukup mudah. Cukup menggunakan perintah OpenSSL untuk membuatnya. Self-Signed Certificate dapat digunakan untuk kebutuhan development website lokal.