Cara mencegah hotlink dengan CloudFlare security rules

Hotlink adalah praktik menautkan langsung ke file, seperti gambar atau video, yang dihosting di server situs web lain, bukan mengunggahnya ke server mereka sendiri. Ini akan menguras sumber daya server dari situs web asli, yang dapat mengakibatkan membengkaknya penggunaan bandwidth dan biaya tagihan server yang harus dibayar pemilik situs asli dari gambar/video yang di hotlink. Praktik ini sangat dibenci oleh mayoritas pemilik website, tidak etis, dan berpotensi melanggar hak cipta.

Cara kerjanya secara singkat, ketika seseorang melihat halaman dengan gambar yang di hotlink, browser web mereka akan mengambil gambar tersebut langsung dari server situs asli, bukan dari server situs yang sedang mereka kunjungi.

Mengatasi Hotlink dengan security rules

Mencegah hotlink dapat dilakukan melalui beberapa cara, yaitu melalui .htaccess atau config di Nginx, tapi jika kita tidak menggunakan Apache atau Nginx (misalnya menggunakan Astro atau Jekyll), cara yang paling ampuh adalah memblokir Hotlink dari edge CloudFlare, yang akan mencegah semua percobaan Hotlink bahkan sebelum pelaku Hotlink menyentuh gambar/video dari situs kita.

Login ke CloudFlare

Masuk ke akun Anda, kemudian pilih situs web yang akan diproteksi oleh security rules, jika ada lebih dari satu situs, tampilannya akan seperti ini.

Buat Security rules

Setelah memilih situs web, di bilah menu bagian kiri, masuk ke menu Security Security rules, kemudian klik tombol Create rules Custom rules. Selanjutnya isi Rule name dengan nama apa saja, misal test hotlink (nama rules wajib diisi). Pada bagian When incoming requests match, di sebelah kanan Expression Preview, klik Edit expression lalu isi dengan ini:

(lower(http.request.uri.path) matches "\\.(jpe?g|png|gif|avif|webp)$") and http.referer ne "" and not (http.referer contains "website-a.com" or http.referer contains "localhost" or http.referer contains "website-b.com")

Penjelasan:

• Cek file gambar: URL yang diakses berakhiran .jpg, .jpeg, .png, .gif, .avif, atau .webp.
• Harus ada referer: Permintaan hanya match jika http.referer tidak kosong.
• Referer dibatasi: Ditolak jika referer bukan dari website-a.com, localhost, atau website-b.com.

Kemudian, di bagian Then take action, pilih opsi Block, pilih Default CloudFlare block page yang nantinya akan menghasilkan kode HTTP 403. Pada Place at, pilih First (supaya ada di urutan pertama).

Langkah terakhir, klik Deploy untuk menerapkan perubahan.

Hasilnya akan seperti dibawah ini:

Uji coba

Kita akan coba apakah gambar berikut ini akan berhasil di hotlink atau tidak.

Kita akan gunakan dua situs khusus untuk uji coba hotlink, yaitu ThePCMan Website, dan Coldlink.

Hasil ThePCMan Website

Hasil Coldlink

Kesimpulan

Dengan membuat security rule sederhana di Cloudflare yang memeriksa ekstensi gambar, memastikan referer tidak kosong, dan memblokir akses dari luar domain yang diizinkan, kita dapat menghentikan hampir semua percobaan hotlink.

Setelah rule diterapkan dan cache dibersihkan, gambar akan gagal dimuat (broken) di situs pelaku yang tidak diizinkan, sehingga bandwidth server kita sepenuhnya terlindungi.