Mixed content atau konten campuran sering terjadi saat kita hijrah dari http atau https dalam pemasangan SSL/ TLS. Namun, ini juga bisa terjadi karena faktor lainnya juga. Yang pasti, masalah mixed content harus segera kita atasi.
Karena jika tidak, mixed content ini akan sangat mengganggu pengguna yang mengakses website kita. Ada sebagian konten yang tidak bisa diakses dan tidak menggunakan protokol yang seharusnya.
Nah di artikel ini, Panda akan mengulas secara khusus apa itu mixed content dan bagaimana cara mengatasi permasalahan ini. Semoga bermanfaat!
Apa itu Mixed Content?
Mixed Content adalah sebuah kondisi dimana sebuah halaman website yang secure (menggunakan protokol HTTPS), tapi didalamnya masih terdapat resource yang masih menggunakan protokol non-secure atau HTTP. Resource ini baik file javascript, CSS, atau file gambar yang non secure.
Contoh sederhananya saat kita baru memasang SSL dan migrasi dari HTTP ke HTTPS. Alamat website kita sudah berubah ke https://domain.com, namun ternyata sebagian sumber daya masih beralamatkan http, seperti http://domain.com/images/file-gambar.jpg.
Nah, dua jenis konten beda protokol ini akan menimbulkan masalah di website. Karena konten jenis pertama akan dikirim melalui protokol yang aman, dan protokol kedua dikirim lewat protokol tidak aman dan tidak dienkripsi.
Konten campuran yang muncul karena faktor protokol HTTP ini bisa memunculkan resiko keamanan yang tidak terduga untuk para pengunjung website maupun website itu sendiri. Secara garis besar, kehadiran masalah ini bisa melemahkan keamanan dan user experience.
Selain itu, para web browser juga tentunya akan memproteksi pengguna mereka dari website yang punya masalah keamanan. Mereka akan menandai dengan label non-secure saat masalah mixed content ini belum teratasi. Bahkan sejak Desember 2019, Chrome mengumumkan bahwa mereka akan memblokir website dengan mixed content ini.
Jenis- jenis Mixed Content
Dalam Mixed Content ini kita mengenal setidaknya dua jenis kategori :
1. Passive Mixed Content
Passive Mixed Content adalah sebuah konten yang tidak melakukan interaksi lebih dengan halaman website. Kategori konten campuran pasif ini terdiri dari gambar, video, serta materi audio yang membuat resource lain tidak bisa melakukan interaksi secara lebih di halaman website.
Jadi jangan heran jika display gambar tidak muncul atau thumbnail rusak karena efek dari mixed content ini.
Passive mixed content ini tidak terlalu mengganggu dan mengakibatkan resiko yang tidak terduga lebih rendah. Kendati begitu, passive mixed content ini juga bisa menimbulkan ancaman keamanan di website.
2. Active Mixed Content
Kebalikannya dari konten campuran pasif, Active Mixed Content ini aktif berinteraksi dengan halaman website secara keseluruhan. Yang termasuk ke dalam konten campuran aktif ini antara lain skrip, iframe, stylesheet, resource flash, serta kode- kode lain yang bisa diunduh dan dieksekusi langsung oleh browser.
Komponen tersebut merupakan sumber daya vital untuk website. Pihak yang tidak bertanggung jawab punya kemungkinan untuk melakukan hampir semua hal di halaman website. Kerusakan yang diakibatkan juga akan lebih besar dari passive mixed content.
Kejadian yang bisa terjadi karena active mixed content ini misalnya mengubah isi konten menjadi sangat berbeda dengan aslinya, pencurian kata sandi, akses masuk, pencurian cookie pengguna, atau membuat redirect ke situs lain.
Browser biasanya akan memblokir tipe active mixed content ini untuk melindungi keamanan pengguna karena resikonya cukup besar.
Mengecek Mixed Content di Website
Meskipun website tidak diblokir oleh browser, Andab isa melakukan pengecekan apakah di website masih ada mixed content atau tidak. Ada dua tool yang bisa Anda gunakan disini, yaitu JitBit SSL Checker dan plugin WordPress, Really Simple SSL.
JitBit SSL Checker memungkinkan Anda untuk memindai hingga 400 halaman di website untuk mengetahui apakah ada masalah SSL, seperti Mixed Content. Tapi ingat, jika halaman Anda sangat banyak, itu artinya ada sebagian yang tidak terscan oleh tool ini.
Sedangkan Really Simple SSL adalah plugin yang bisa menangani masalah migrasi SSL dan memperbaiki masalah mixed content. Really Simple SSL juga akan Panda ulas kembali di segmen di bawah, sebagai salah satu rekomendasi solusi mengatasi mixed content.
Cara Mengatasi Masalah Mixed Content di Website WordPress
Sudah pasang SSL tapi masih ditandai sebagai non secure karena mixed content? Bagaimana cara mengatasinya?
Tidak perlu panik, karena ada dua cara ampuh yang bisa membantu Anda mengatasi mixed content ini untuk pengguna WordPress.
1. Plugin Really Simple SSL
Seperti yang sempat Panda singgung di atas, Plugin Really SSL bisa membantu mengatasi masalah mixed content. Plugin ini mempunyai fitur yang mendeteksi semua resource yang ditandai sebagai mixed content, dan mengubahnya menjadi resource yang secure.
Cara memperbaiki mixed content dengan plugin ini :
- Install dan aktifkan plugin Really Simple SSL.
- Masuk ke bagian Setting, aktifkan Mixed Content Fixer.
Setelah beberapa saat, coba periksa kembali website Anda dan refresh ulang lewat browser.
2. SSL Insecure Content Fixer
SSL Insecure Content Fixer adalah plugin alternatif Really Simple SSL yang bisa memperbaiki masalah mixed content.
Sama seperti Really Simple SSL, Anda hanya tinggal menginstal dan mengaktifkan plugin ini. Setelah plugin terinstal, masuk ke bagian pengaturan > Fix insecure content , dan pilih Simple.
Anda juga bisa memilih pengaturan yang dirasa lebih sesuai. Namun untuk banyak developer, pengaturan Simple ini bekerja dengan baik untuk mengatasi masalah konten campuran.
3. Masalah Mixed Content Belum Hilang? Gunakan Plugin Better Search and Replace
Pada umumnya, Anda hanya cukup menggunakan salah satu dari dua plugin di atas. Banyak webmaster memilih Plugin Really Simple SSL, karena plugin tunggal ini juga membantu dalam konfigurasi SSL di awal.
Namun, bagaimana jika masalah mixed content masih saja muncul?
Ini artinya, ada beberapa url yang perlu Anda ganti dari http ke https. Anda bisa mencoba membuka laman web yang ditandai non-secure oleh Google Chrome, lalu lihat Sumber Halaman atau tekan CTRL+U.
Selanjutnya, tekan CTRL+F, dan lakukan pencarian untuk src=”http (Hanya satu kutipan di depan). Pastikan Anda tidak menemukan sumber daya dengan protokol HTTP ini. Namun jika menemukannya, Anda perlu memperbaiki sumber daya tersebut di database dengan HTTPS.
Nah, rasanya akan merepotkan untuk melakukan pengecekan di database dan menggantinya satu per satu, ya?
Terutama jika penemuan Anda ini cukup banyak. Sebagai solusinya, Anda bisa menggunakan plugin Better Search and Replace :
- Instal dan Aktifkan plugin Better Search and Replace
- Buat backup dari website lebih dulu, ini penting sebagai langkah antisipasi jika ada masalah
- Masuk ke bagian pengaturan plugin, ke tab Search/Replace
- Di field Search, masukkan URL website Anda dengan protokol http
- Di field Replace, masukkan URL website Anda dengan protokol https
- Pilih semua tabel di database dengan Ctrl+A
- Centang opsi Run as Dry Run. Opsi ini memastikan kesalahan apapun tidak merusak situs Anda dan bisa diperbaiki sebelumnya
- Terakhir, tap pilihan Run Search/Replace
Tunggu sampai proses selesai dan voila, Anda berhasil mengatasi masalah mixed content di website Anda secara keseluruhan.
Kesimpulan
Karena termasuk memulai di angkatan lawas (jaman SSL belum begitu bergaung), website Panda sendiri dulu sekali pernah mengalami masalah mixed content ini. Dan masalah masih muncul meskipun sudah menggunakan Plugin Really Simple SSL.
Akhirnya, sebagai pamungkas mengatasi masalah ini, plugin Better Search and Replace berhasil mengatasi masalah mixed content. Dan, plugin ini masih WORK sampai sekarang untuk mengatasi masalah konten campuran.
Jadi saat Anda mengalami masalah konten campuran ini, baik itu dari peringatan browser, atau display gambar error karena mixed content, langkah- langkah di atas sangat membantu dalam memperbaiki masalah tersebut.
Itu tadi pembahasan Panda tentang apa itu mixed content (konten campuran) dan langkah ampuh mengatasinya. Semoga bermanfaat ya!