Gagal memuat sumber daya di bawah Chrome

Ada banyak gambar di halaman web.

Peramban lain mengunduhnya dengan benar, tetapi Chrome tidak memuatnya.

Di konsol pengembang, ini menunjukkan pesan berikut untuk setiap gambar:

gagal memuat sumber

Masalah ini hanya muncul di Chrome.

Apa itu?

Saya baru-baru ini mengalami masalah ini dan menemukan bahwa itu disebabkan oleh ekstensi "Adblock" (tebakan terbaik saya adalah karena saya memiliki kata "spanduk" dan "iklan" dalam nama file).

Sebagai pengujian cepat untuk melihat apakah itu masalah Anda, mulai Chrome dalam mode penyamaran dengan ekstensi dinonaktifkan ( ctrl+ shift+n ) dan lihat apakah halaman Anda berfungsi sekarang. Perhatikan bahwa secara default semua ekstensi akan dinonaktifkan dalam mode penyamaran kecuali Anda telah secara khusus mengaturnya untuk dijalankan (via chrome://extensions).

Periksa tab jaringan untuk melihat apakah Chrome gagal mengunduh file sumber daya apa pun.

Jika itu membantu siapa pun, saya memiliki masalah yang sama persis ini dan menemukan bahwa itu disebabkan oleh Ekstensi Chrome "Jangan Lacak Plus" (versi 2.0.8). Ketika saya menonaktifkan ekstensi itu, gambar dimuat tanpa kesalahan.

Ada juga opsi untuk mematikan cache untuk sumber daya jaringan. Ini mungkin yang terbaik untuk mengembangkan lingkungan.

1. Klik kanan chrome
2. Pergi ke 'periksa elemen'
3. Cari tab 'jaringan' di suatu tempat di atas. Klik itu.
4. Centang kotak 'nonaktifkan cache'.

Solusi Kabir benar. URL gambar saya tadinya

/images/ads/homepage/small-banners01.png, 

dan ini membuat AdBlock tersandung. Ini bukan masalah lintas-domain bagi saya, dan gagal baik pada localhost maupun di web.

Saya menggunakan tab jaringan Chrome untuk melakukan debug dan menemukan hasil yang sangat membingungkan untuk gambar khusus ini yang gagal dimuat. Permintaan pertama tidak akan mengembalikan respons (Status "(tertunda)"). Kemudian, ada permintaan kedua yang mencantumkan URL asli dan kemudian "Redirect" sebagai Pemrakarsa. Header permintaan redirect adalah semua untuk baris pendek identik dari data yang dikodekan base64 ini, dan masing-masing tidak memberikan respons, meskipun statusnya "Berhasil":

GET      data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg== HTTP/1.1

Kemudian saya perhatikan bahwa gaya inline ini ditambahkan ke semua elemen gambar:

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;

Akhirnya, saya tidak menerima pesan "gagal memuat sumber daya" di konsol, melainkan ini:

Port error: Could not establish connection. Receiving end does not exist.

Jika ada hal-hal ini terjadi pada Anda, itu mungkin ada hubungannya dengan AdBlock. Matikan dan / atau ganti nama file gambar Anda.

Selain itu, karena CSS sebaris yang dibuat oleh AdBlock, tata letak slider promosi saya dibuang. Sementara saya bisa memperbaiki masalah tata letak dengan CSS sebelum menemukan solusi Kabir, CSS itu agak tidak perlu dan mempengaruhi fleksibilitas slider untuk menangani gambar dari berbagai ukuran.

Saya kira pelajarannya adalah: Berhati-hatilah dengan nama gambar Anda. Gambar-gambar ini tidak berbahaya atau menjengkelkan karena mereka mengingatkan pengunjung untuk promosi dan spesial saat ini dengan cara yang tidak mengganggu.

Jika gambar dihasilkan melalui ASP Response.Write(), pastikan Anda tidak menelepon Response.Close();. Chrome tidak menyukainya.

Saya mendapatkan kesalahan ini, hanya di Chrome (versi terakhir 24.0.1312.57 m), dan hanya jika gambar lebih besar dari html img. Saya menggunakan skrip php untuk menampilkan gambar seperti ini:

header('Content-Length: '.strlen($data));
header("Content-type: image/{$ext}");
echo base64_decode($data);

Saya mengatasinya dengan menambahkan 1 pada panjang gambar:

header('Content-Length: '.strlen($data) + 1);
header("Content-type: image/{$ext}");
echo base64_decode($data);

Tampaknya Chrome tidak mengharapkan jumlah byte yang benar.

Diuji dengan berhasil di Chrome dan IE 9. Semoga bantuan ini.

Fakta:

• Saya telah menonaktifkan semua plugin, dan masalahnya masih ada.
• Ada beberapa situs, di mana masalahnya tidak terjadi.
• Ini masalah yang diketahui. Lihat Masalah 424599: Gagal memuat sumber daya: net :: ERR_CACHE_MISS kesalahan saat membuka DevTools di halaman PHP dan pertanyaan Stack Overflow Kesalahan Aneh di Konsol Pengembang Chrome - Gagal memuat sumber daya: net :: ERR_CACHE_MISS .

Ada pekerjaan sementara di sekitar Reenable (sementara) dukungan showModalDialog di Chrome (untuk Windows) 37+ .

Pada dasarnya, buat string baru di registri di

HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Chrome\EnableDeprecatedWebPlatformFeatures

Di bawah kunci EnableDeprecatedWebPlatformFeatures, buat nilai string dengan nama 1dan nilai ShowModalDialog_EffectiveUntil20150430. Untuk memverifikasi bahwa kebijakan ini diaktifkan, kunjungi chrome://policyURL.

FYI - Saya memiliki masalah ini juga dan ternyata html saya mencantumkan file .jpg dengan .JPG dalam huruf besar, tetapi file itu sendiri adalah huruf kecil .jpg. Itu diterjemahkan secara lokal dan menggunakan Codekit, tetapi ketika didorong ke web itu tidak akan dimuat. Cukup mengubah nama file untuk memiliki ekstensi .jpg huruf kecil untuk mencocokkan html melakukan trik.

Di Chrome (Canary) saya tidak mencentang ekstensi "Appspector". Itu menghapus kesalahan.

Saya memperbarui browser Chrome saya ke versi terbaru dan masalah telah diperbaiki.

Ini karena pemblokir iklan. Ketika nama file proyek berisi kata-kata seperti 'iklan' maka pemblokir iklan juga memblokir file-file ini untuk dimuat.

Solusi terbaik adalah jangan pernah menyimpan file apa pun dengan kunci nama ini.