Cara Mengatasi Not Allowed to Load Local Resource Saat Memutar Audio di Browser

Saat mengembangkan website, terutama yang menampilkan media seperti audio, kamu mungkin pernah menemukan error “Not allowed to load local resource” di browser.

Error ini sering terjadi ketika mencoba memutar file audio yang berasal dari file lokal (misalnya dari komputer sendiri), bukan dari server atau URL publik.

Kenapa Error Ini Terjadi

Browser modern memiliki sistem keamanan yang ketat. Salah satu tujuannya adalah mencegah akses langsung ke file lokal pengguna karena berpotensi menimbulkan risiko keamanan.

Akibatnya, file dengan path seperti ini tidak akan bisa diputar:

file:///C:/Users/Audio/music.mp3

Browser akan memblokir akses tersebut dan menampilkan error “Not allowed to load local resource”.

Solusi: Gunakan URL Publik

Agar audio bisa diputar dengan normal, file harus diupload ke server dan diakses melalui URL publik.

Berikut contoh penggunaan tag audio yang benar:

<audio controls>
  <source src="https://example.com/audio.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

Pastikan:

  • File audio sudah diupload ke hosting
  • URL dapat diakses secara publik
  • Format file sesuai (mp3, wav, dll)

Implementasi di WordPress

Jika kamu menggunakan WordPress, kamu bisa mengupload file audio melalui:

Media → Add New

Setelah upload selesai, salin URL file tersebut dan gunakan pada tag audio atau embed langsung di dalam artikel.

Alternatif: Gunakan Platform Pihak Ketiga

Jika tidak ingin membebani server, kamu bisa menggunakan layanan pihak ketiga seperti SoundCloud untuk menyimpan audio.

Kemudian, kamu cukup menambahkan embed atau link audio ke dalam website.

Cara ini juga membantu menghemat bandwidth hosting kamu.

Tips Tambahan

Agar fitur audio berjalan optimal, perhatikan hal berikut:

  • Gunakan format audio yang umum seperti MP3
  • Pastikan ukuran file tidak terlalu besar
  • Gunakan hosting yang cepat
  • Hindari path lokal (file:///)

Kesimpulan

Error “Not allowed to load local resource” terjadi karena pembatasan keamanan browser terhadap file lokal.

Solusinya adalah menggunakan file yang di-hosting secara online dan diakses melalui URL publik.

Dengan cara ini, audio bisa diputar dengan lancar di semua browser tanpa kendala.

Fitur ini sangat penting terutama jika kamu mengelola website berita atau blog yang membutuhkan konten multimedia.

Kalau kamu mau, nanti kita bisa lanjut ke tutorial membuat audio player custom yang lebih menarik dan modern.

Tinggalkan Balasan