Menonaktifkan cache Chrome untuk pengembangan situs web

Saya memodifikasi tampilan situs (modifikasi CSS) tetapi tidak dapat melihat hasilnya di Chrome karena cache persisten yang mengganggu. Saya mencoba Shift+ menyegarkan tetapi tidak berhasil.

Bagaimana saya bisa menonaktifkan cache sementara atau menyegarkan halaman sedemikian rupa sehingga saya bisa melihat perubahannya?

Chrome DevTools dapat menonaktifkan cache.

1. Klik kanan dan pilih Inspect Elementuntuk membuka DevTools. Atau gunakan salah satu pintasan keyboard berikut :
   • F12
   • Command+ Option+ idi Mac
   • Control+ Shift+ iPada Windows atau Linux
2. Klik Network di bilah alat untuk membuka panel jaringan.
3. Periksa dengan Disable cachekotak centang di bagian atas.

Perlu diingat, seperti yang dikatakan tweet dari @ChromiumDev , pengaturan ini hanya aktif ketika devtools terbuka .

Perhatikan bahwa ini akan mengakibatkan semua sumber daya dimuat ulang. Jika Anda ingin menonaktifkan cache hanya untuk beberapa sumber daya, Anda dapat memodifikasi header HTTP yang dikirim server Anda bersama file Anda.

Jika Anda tidak ingin menggunakan Disable cachekotak centang, tekan agak lama pada tombol segarkan dengan DevTools terbuka akan menampilkan menu dengan opsi Hard Reloadatau Empty Cache and Hard Reloadyang seharusnya memiliki efek yang sama. Baca tentang perbedaan antara opsi . Pintasan berikut tersedia:

• Command+ Option+ Rdi Mac
• Control+ Shift+ RPada Windows atau Linux

Membersihkan cache terlalu mengganggu ketika Anda perlu menghapus cache 30 kali dalam satu jam .. jadi saya menginstal Chrome Extension yang disebut Classic Cache Killer yang membersihkan cache pada setiap halaman load.

Tautan Toko Chrome (gratis) (Sekarang tanpa malware!)

Sekarang mock json, javascript, css, html, dan data saya diperbarui setiap kali di setiap halaman dimuat .

Saya tidak perlu khawatir jika perlu menghapus cache.

Ada sekitar 20 pembersih cache untuk Chrome yang saya temukan, tetapi yang ini terasa ringan dan tidak ada usaha. Dalam pembaruan, Pembunuh Cache sekarang dapat tetap "selalu aktif".

Catatan: Saya tidak tahu pembuat plugin dengan cara apa pun. Saya baru saja merasakan manfaatnya.

1. Tarik konsol pengembang Chrome dengan menekan F12lalu (dengan konsol terbuka):

2. Klik kanan (atau tahan klik kiri) pada tombol muat ulang di bagian atas browser dan pilih "Empty Cache and Hard Reload."

Ini akan melampaui "Hard Reload" untuk mengosongkan cache sepenuhnya, memastikan bahwa apa pun yang diunduh melalui javascript atau lainnya juga akan menghindari penggunaan cache. Anda tidak perlu mengacaukan pengaturan atau apa pun, itu solusi cepat 1-shot.

Ada dua opsi lagi untuk menonaktifkan caching halaman di Chrome untuk selamanya :

1. Nonaktifkan Cache Chrome di Registry

Buka Registry (Mulai -> Perintah -> Regedit)

Pencarian untuk: HKEY_CLASSES_ROOT\ChromeHTML\shell\open\command

Ubah bagian setelah ... chrom.exe "ke nilai ini: –disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

Contoh: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" -disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

PENTING:

• ada spasi dan tanda hubung setelah ... chrome.exe "

• biarkan path ke chrome.exe apa adanya

• Jika Anda menyalin garis, pastikan untuk memeriksa, apakah tanda kutip adalah tanda kutip aktual.

2. Nonaktifkan cache Chrome dengan mengubah properti pintasan

Klik kanan pada ikon Chrome dan pilih "Properties" di menu konteks. Tambahkan nilai berikut ke jalur: –disk-cache-size=1

Contoh: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" –disk-cache-size=1

PENTING:

• ada spasi dan tanda hubung setelah ... chrome.exe "

• biarkan path ke chrome.exe apa adanya

Jika Anda tidak ingin mengedit pengaturan Chrome, Anda dapat menggunakan mode penyamaran untuk hasil yang sama.

Selain opsi cache yang dinonaktifkan (yang Anda dapatkan melalui tombol di sudut kanan bawah jendela alat pengembang - Alat | Alat Pengembang, atau Ctrl+ Shift+ I), pada panel jaringan alat pengembang sekarang Anda dapat mengklik kanan dan pilih "Clear Cache" dari menu popup.

1. F12 untuk membuka Chrome DevTools
2. F1 untuk membuka Pengaturan DevTools
3. Periksa Nonaktifkan cache (saat DevTools terbuka) seperti yang ditunjukkan di bawah ini:

Ini saat ini pada tab Preferensi yang merupakan default. Anda mungkin perlu gulir ke bawah. Kotak centang ini telah dipindahkan setidaknya beberapa kali sejak pertanyaan ini diajukan. Terakhir saya periksa, itu ada di kolom tengah di bagian bawah. Jika Anda membukanya di layar yang lebih tipis dan ada 2 kolom di bawah Preferensi, mungkin berada di dekat kanan atas. Jangan ragu untuk memperbarui posting ini jika itu berubah atau berkomentar dan saya akan memperbarui posting ini.

Alih-alih memukul "F5" Tekan saja:

"Ctrl + F5"

Di Kanal Kanal (dan mungkin dev dan kanal stabil akan mengikuti) ini dapat ditemukan sebagai opsi kedua secara keseluruhan di sisi kiri di bawah bagian "Umum".

Selain itu, selalu ada opsi untuk beralih ke Mode Penyamaran melalui Ctrl + Shift + N. Meskipun itu sayangnya juga mengakhiri sesi Anda.

Menggunakan Ctrl+ Shift+ Runtuk menyegarkan itu bagus tetapi tidak mendapatkan semua yang saya butuhkan. masih ada beberapa hal yang tidak menyegarkan, seperti data yang disimpan dalam js dan css. menemukan solusi: bilah alat google untuk pengembang web chrome . Setelah Anda menginstal toolbar pilih opsi dan "reset halaman".

Agar jelas, kotak centang nonaktifkan cache di Chrome (v17 di sini, tetapi karena v15 saya percaya) tidak ada dalam UI pengaturan utama. Itu ada di UI pengaturan alat pengembang.

1. Dari menu ikon kunci inggris jendela peramban (menu pra) pilih Alat → Alat Pengembang

2. Di UI alat pengembang yang muncul, klik ikon roda gigi di kanan bawah.

3. Centang kotak 'Nonaktifkan cache' di bagian Jaringan.

Nonaktifkan cache di chrome hanya berfungsi ketika Anda memiliki alat dev terbuka

Sampai bug diperbaiki, Anda dapat menggunakan plugin Clear Cache Chrome dan Anda juga dapat mengatur pintasan keyboard untuk itu.

Setelah menginstalnya, klik kanan dan pergi ke opsi:

Periksa Automatically reload active tab after clearing data:

Pilih Everythinguntuk Periode Waktu:

Dan kemudian Anda dapat pergi ke Menu => Alat => Ekstensi:

Klik pintasan keyboard di bagian bawah:

Dan atur pintasan keyboard Anda, misalnya Ctrl+ Shift+ R:

Sebenarnya jika Anda tidak keberatan menggunakan bandwidth, lebih aman karena berbagai alasan untuk menonaktifkan caching dan disarankan oleh banyak situs keamanan.

Chromium seharusnya tidak cukup arogan untuk membuat keputusan dan menegakkan pengaturan pada pengguna.

Anda dapat menonaktifkan cache di UNIX dengan --disk-cache-dir = / dev / null.

Karena ini adalah crash yang tidak terduga mungkin terjadi tetapi jika mereka melakukannya maka itu jelas akan menunjukkan bug yang lebih parah yang harus diperbaiki dalam hal apa pun.

Ini mungkin membantu seseorang.

Saya telah mencurangi Nginx saya untuk caching gila. Dengan demikian, menonaktifkan cache di alat jaringan dan secara eksplisit membersihkan cache tidak berfungsi.

Solusi yang sangat sederhana namun membosankan adalah, saya baru saja membuka Tab Penyamaran baru. Anehnya itu bekerja, sepanjang waktu!

Penyegaran keras dalam mode penyamaran melakukan trik kapan pun saya ingin memuat ulang dalam mode yang sama.

Bagaimana dengan bookmarklet yang mengubah nama halaman untuk mencegah halaman dari cache. Di Chrome, Anda akan membuat bookmark baru dan kemudian menempelkan kode ke URL. Klik bookmark dan halaman akan memuat ulang dengan timestamp untuk menggagalkan cache.

javascript:(function(){var idx = location.href.indexOf('?');var d = new Date();var str = location.href.substr(0,idx) + '?version=' + d.getTime();location.href=str; void 0;})();

Saya baru saja ketahuan tetapi belum tentu karena Chrome.

Saya menggunakan jQuery untuk membuat permintaan AJAX. Atribut cache disetel ke true dalam permintaan:

   $.ajax({
        type: 'GET',
        cache: true,
        ....

Menetapkan ini ke false memperbaiki masalah saya tetapi ini tidak ideal.

Saya tidak tahu di mana data ini disimpan tetapi saya tahu bahwa chrome tidak pernah menekan server untuk permintaan.

Ada cara yang lebih baik dan lebih cepat sekarang (Chrome versi 59.xx):

Klik kanan pada ikon reload (sebelah kiri url-field) dan Anda mendapatkan menu drop-down, pilih opsi ketiga: 'kosongkan Cache dan Hard reload'.

Opsi ini hanya tersedia ketika alat pengembang terbuka. (Perhatikan perbedaan pada opsi 2: 'Hard reload' -cmd-shift-R). Tidak ada cache yang kosong di sini!

Ada ekstensi chrome yang tersedia di toko web chrome bernama Clear Cache .

Saya menggunakannya setiap hari dan itu alat yang sangat berguna menurut saya. Anda dapat menggunakannya sebagai tombol muat ulang dan dapat menghapus cache dan jika Anda juga suka cookie, penyimpanan lokal, data formulir dll. Anda juga dapat menentukan di mana domain ini terjadi. Jadi dapat menghapus semua omong kosong ini hanya dengan tombol muat ulang yang harus Anda tekan - pada domain yang Anda pilih.

Sangat sangat bagus!

Anda juga dapat menentukan Pintasan Keyboard untuk ini dalam opsi!

Cara lain adalah memulai jendela chrome Anda dalam mode penyamaran. Di sini cache juga harus dinonaktifkan sepenuhnya.

Satu lagi opsi untuk menonaktifkan cache disediakan oleh Inspektur Ukuran Halaman ekstensi Chrome ke-3 saya yang menonaktifkan cache persis sama seperti yang dilakukan Devtools.

Selain itu, ekstensi dengan cepat melaporkan ukuran halaman, penggunaan cache, permintaan jaringan dan waktu buka halaman web dengan cara yang mudah. Ditambah sumber terbuka di Github .

Tidak yakin apa yang Anda gunakan, tetapi jika Anda menggunakan ASP.Net Anda dapat melakukan hal-hal berikut yang berfungsi seperti pesona:

<link href="@Url.Content("~/Content/Site.css")?time=@DateTime.Now" rel="stylesheet" />

Pada dasarnya ini akan secara otomatis menambahkan Tanggal dan Waktu ke akhir file setiap kali dijalankan, artinya karena nama file secara teknis berbeda, Anda tidak perlu khawatir tentang itu akan di-cache lagi.

Saya memiliki masalah yang sama, saya mencoba:

• Kontrol Shift R,
• Nonaktifkan cache di F12
• Kontrol F5.

Lalu saya menemukan bahwa menggunakan manifes .appcache untuk situs non https sudah usang . Saya menghapus file site.appcache dan rujukannya di tag html dan sekarang saya melihat versi terbaru dari setiap halaman!

Jika Anda menggunakan ServiceWorkers (misalnya: untuk aplikasi web Progresif), Anda mungkin perlu memeriksa "Pembaruan saat memuat ulang" di bawah Aplikasi> Pekerja Layanan dalam alat pengembang juga.

Sejak versi 50 (jika saya ingat dengan benar), opsi "Nonaktifkan cache" telah dihapus dari Pengaturan Devtool. Buka tab "Jaringan" dan ada opsi "Nonaktifkan cache".

Hai jika situs Anda menggunakan PHP, maka tempatkan cuplikan PHP kecil di awal halaman html Anda:

   //dev versioning - stop caching
   $rand = rand(1, 99999999);

Sekarang di mana pun Anda memuat sumber daya seperti file CSS- atau JS- dalam skrip atau elemen tautan, Anda menambahkan nilai acak yang dihasilkan ke URL permintaan setelah menambahkan '?' ke URI melalui PHP:

    echo $rand;

Itu dia! Tidak akan ada lagi peramban yang cache situs Anda - apa pun jenisnya.

Tentu saja hapus kode Anda sebelum menerbitkan atau cukup setel $ rand ke string kosong untuk mengizinkan caching lagi.

Saya telah menggunakan opsi lain yang dijelaskan di atas, tetapi saya menemukan bahwa yang terbaik adalah menambahkan parameter berikut ke startup chrome.exe.

"C: \ Program Files (x86) \ Google \ Chrome \ Application \ chrome.exe" --disk-cache-size = 1 -media-cache = 1

Saya menemukan bahwa tidak menonaktifkan cache media adalah ide yang bagus tetapi ada di sini untuk kelengkapannya.

Sebenarnya saya ingin opsi untuk sepenuhnya menonaktifkan cache, untuk menggunakan memori untuk IO daripada disk saya (yang akan membuat waktu buka 10x lebih cepat juga!) Tapi saya tidak berpikir chrome atau browser apa pun dalam hal ini masih memiliki opsi itu .

Bagaimana saya bisa menonaktifkan cache sementara atau menyegarkan halaman sedemikian rupa sehingga saya bisa melihat perubahannya?

Tidak jelas "cache" mana yang Anda maksud. Ada beberapa metode berbeda yang dapat dilakukan oleh browser untuk menyimpan konten secara terus-menerus. Penyimpanan Web menjadi salah satunya,Cache-Control menjadi yang lain.

Beberapa browser juga memiliki Cache, yang digunakan bersama dengan Pekerja Layanan , untuk membuat Progressive Web Apps (PWA) yang menyediakan dukungan offline.

Untuk menghapus cache untuk PWA

self.caches.keys().then(keys => { keys.forEach(key => console.log(key)) })

untuk mendaftar nama-nama kunci cache, kemudian jalankan:

self.caches.delete('my-site-cache')

untuk menghapus kunci cache dengan nama (yaitu, my-site-cache). Kemudian segarkan halaman.

Jika Anda melihat kesalahan terkait pekerja di konsol setelah penyegaran, Anda mungkin juga perlu membatalkan registrasi pekerja yang terdaftar:

navigator.serviceWorker.getRegistrations()
  .then(registrations => {
    registrations.forEach(registration => {
      registration.unregister()
    }) 
  })

Sejauh ini pembunuh Cache Chrome adalah pilihan terbaik. Karena URL toko untuk menginstal cache killer sedang down, Anda dapat mengunduh file CRX di sini:

https://www.crx4chrome.com/extensions/jpfbieopdmepaolggioebjmedmclkbap/

setelah file ekstensi diunduh, buka Chrome -> lebih banyak alat -> ekstensi, lalu seret file CRX dari File Explorer atau Desktop Anda (tergantung lokasi tempat Anda mengunduh file) ke jendela chrome untuk menginstal ekstensi.

Saya menggunakan (di windows), ctrl + shift + delete dan ketika dialog chrome muncul, tekan tombol enter. Ini dapat dikonfigurasi dengan apa yang perlu dihapus setiap kali Anda menjalankan urutan ini. Tidak perlu memiliki dev. alat terbuka dalam hal ini.

Saya berada dalam situasi di mana browser memuat data cache dari disk bahkan saya memeriksanya cache yang dinonaktifkan (saya menggunakan Chrome). Semua CSS dan JS saya memuat dari server tetapi bukan halaman web. Ini terjadi pada produksi lokal dan saya.

Untuk memperbaikinya, saya harus meletakkan param tambahan di URL saya untuk memaksa browser untuk mendapatkan halaman web dari server, bahkan controller tidak memerlukannya.

Saya menggunakan ASP.Net, jadi inilah contoh saya:

//Controller function
public ActionResult Index()
    {
        return View();
    }
//Link
@Html.Action("Index", "Home", new { ts = DateTime.Now.Ticks.ToString()})

Hasilnya, itu akan menghasilkan tautan seperti: http://www.myweb.com/Home/Index?ts=636558555408282209

Ini adalah situasi dan solusi saya. Semoga itu bisa membantu seseorang.