Paksa Google Chrome untuk memeriksa file JavaScript baru setiap kali saya mengakses situs web

25

Jadi, jika saya pergi ke opsi Internet di Internet Explorer:

Saya dapat menyesuaikan pengaturan ketika IE memeriksa pembaruan:

Bisakah saya melakukan hal serupa di Google Chrome? Saat ini ketika saya mengubah file JavaScript dan debug dari Visual Studio, Chrome akan selalu menggunakan versi cache daripada menggunakan versi yang dimodifikasi. Untuk dapat menggunakan versi saat ini saya harus secara manual menghapus file / cache internet sementara saya, yang benar-benar menjengkelkan.

— EJoshuaS - Pasang kembali Monica
sumber

14

Mengapa Anda tidak menonaktifkan caching yang dilakukan oleh Visual Studio? (Serius, siapa sih yang mendesain IDE dengan caching?)

— jpmc26

2

@ jpmc26 Caching apa?

— EJoshuaS

21

Saya mengucapkan komentar terakhir saya dengan longgar; permintaan maaf saya jika itu membuatnya tidak jelas. Browser hanya menyimpan file cache jika server mengirim kembali header spesifik. Itu bodoh untuk server pengembangan Visual Studio untuk mengirim kembali header cache secara default, karena perubahan pada file-file itu harus diharapkan . Pemuatan paruh detik tambahan halaman ini layak tidak berurusan dengan masalah dari file JS dan CSS yang sudah ketinggalan zaman yang di-cache di browser. Saya sungguh berharap ada beberapa cara untuk menonaktifkannya.

— jpmc26

1

Tidak dapat menemukan opsi Visual Studio tetapi perubahan web.config pengembangan dapat menyelesaikan caching di visual studio. iis.net/configreference/system.webserver/staticcontent/…

— GER

1

Ekstensi Chrome "Cache Killer" menyelesaikannya untuk saya, saya tidak tahu mengapa tetapi ctrl + f5 terkadang tidak bekerja untuk saya

— flagg19

55

Opsi 1: Nonaktifkan cache sementara

Buka Alat Pengembang (Tekan F12atau Menu, Alat Lebih Banyak, Alat Pengembang)
Buka Pengaturan Alat Pengembang (Tekan F1atau Menu DevTools, Pengaturan)
Centang "Nonaktifkan cache (saat DevTools terbuka)" di bawah tajuk Jaringan panel Preferensi

Opsi 2: Nonaktifkan cache untuk sesi

Mulai Chrome dengan sakelar baris perintah --disk-cache-size=1 --media-cache-size=1yang akan membatasi cache hingga 1 byte, secara efektif menonaktifkan cache.

Opsi 3: Refresh Angkatan Manual

Muat ulang halaman saat ini, abaikan konten yang di-cache: Shift+ F5atau Ctrl+ Shift+r

Pintasan Keyboard Chrome - Bantuan Chrome (Di bawah "Pintasan laman web")

Opsi 4: Opsi Muat Ulang Ekstra ( Sumber )

Dengan Alat Pengembang terbuka, klik kanan tombol Muat Ulang untuk menampilkan menu muat ulang dengan yang berikut:

Reload Normal (Ctrl + R)
Hard Reload (Ctrl + Shift + R)
Cache Kosong dan Hard Reload

— Steven
sumber

1

@ Bruno Aneh, saya juga selalu menggunakan ctrl + f5. Baru diuji dan keduanya sepertinya berfungsi.

— Jeroen

Saya sarankan menggunakan opsi 2, dengan twist. Buat pintasan terpisah ke Chrome dengan sakelar, dan beri nama berbeda. Letakkan di berbagai ujung Windows Taskbar Anda.

— Christopher Hostage

8

Ini mungkin tidak 100% terkait dengan penyegaran krom tetapi untuk pengembangan lebih lanjut. Seperti yang dikatakan @Dom, Anda dapat menambahkan? V = # setelah sumber daya Anda. Salah satu cara untuk mengotomatiskan proses adalah dengan hash konten file tersebut dan menggunakannya sebagai versi.

Saya memiliki kode cuplikan tentang cara melakukannya di C # (Razor untuk implementasi) jika ini dapat membantu.

Pembantu:

public static string HashUrl(string relativeUrl)
    {
        var server = HttpContext.Current.Server;
        if (File.Exists(server.MapPath(relativeUrl)))
        {
            byte[] hashData;
            using (var md5 = MD5.Create())
            using (var stream = File.OpenRead(server.MapPath(relativeUrl)))
                hashData = md5.ComputeHash(stream);

            return relativeUrl.Replace("~", "") + "?v=" + BitConverter.ToString(hashData).Replace("-", "");
        }
        return relativeUrl + "?v=notFound";
    }

Pelaksanaan:

<link rel="stylesheet" href=@Util.HashUrl("~/Controllers/Home/Views/Index.css") />

Semoga ini membantu

Sunting --- Beberapa telah meminta beberapa runtime build dan untuk 1000 sumber daya kecil, dibutuhkan sekitar 11 ms.

https://en.code-bude.net/2013/08/07/md5-hash-in-c-benchmark-and-speed-%E2%80%8B%E2%808088optimisasi/

https://en.code-bude.net/wp-content/uploads/2013/08/md5_performance_benchmark_2.png

— beauchamp fred
sumber

2

Sumber daya versi seperti ini (atau dengan menyematkan versi / hash dalam nama sumber daya itu sendiri) bisa sangat membantu, terutama ketika menggunakan pembaruan di dunia nyata, di mana - bertentangan dengan apa yang dikatakan aturan pada header kontrol-cache - semua cara cache mungkin terjadi, dan banyak pengguna tidak akan tahu bagaimana (atau kebutuhan) menyegarkan cache. Jika Anda (membuat aplikasi Anda) meminta sumber daya yang baru bernama, itu tidak mungkin di-cache.

— TripeHound

1

Bukankah ini kehilangan kinerja yang besar? Hashing setiap file css dan js setiap kali sebuah tautan dimasukkan dalam halaman ... Apakah Anda menjalankan tolok ukur untuk ini?

— Raidri mengatakan Reinstate Monica

2

@Raidri Hashing on the fly mungkin bukan ide yang baik (saya tidak memperhatikan itu melakukan ini ketika saya pertama kali berkomentar). Memperbarui referensi untuk menggunakan hash atau versi selama proses membangun adalah.

— TripeHound

@Raidri Saya punya aplikasi yang agak kecil dengan meaby 20 sumber daya yang saya hash dan saya belum melihat perbedaan dalam waktu pembuatan jadi saya tidak benar-benar mencoba untuk membandingkannya. Saya juga tidak yakin saya mengerti kalimat kedua Anda tetapi sumber daya di-cache dan browser hanya mengulanginya jika hash berubah => jika Anda mengubah sumber daya itu sendiri.

— fred beauchamp

Hash tidak dihitung pada waktu pembuatan tetapi pada setiap generasi halaman. Itu masalah server dan tidak ada hubungannya dengan caching di browser.

— Raidri mengatakan Reinstate Monica

5

Dalam kasus lain di mana ini mungkin tidak mungkin, misalnya ingin memaksakan penyegaran pada komputer pengguna akhir yang Anda tidak memiliki akses, Anda dapat menambahkan nomor versi ke nama skrip sebagai parameter kueri yang membuat peramban mengidentifikasi sebagai file yang berbeda . yaitu. example.js?v=1. Ingatlah bahwa Anda perlu mengubah nomor pada setiap isi ulang untuk memaksanya.

Anda juga bisa melakukan ini dengan pengembangan lokal, tetapi metode dev tools jauh lebih efisien.

— Dom
sumber

3

sebagai tambahan dari jawaban @Steven, ketika Anda mendapatkan Konsol Alat Pengembang dibuka, Anda dapat Klik Kanan pada tombol segarkan dan gunakan menu drop down.

Di menu ini Anda mendapatkan opsi untuk "Empty Cache and Hard reload" .

Apakah yang Anda cari.

— Leze
sumber

1

Saya berasumsi Anda menggunakan Chrome versi non-Inggris. Saya menggunakan versi bahasa Inggris, dan itu disebut "Empty Cache and Hard reload".

— Nzall

1

Jika Anda mengembangkan situs, maka Anda harus tahu bahwa Chrome memerlukan must-revalidatepengaturan Cache-Controluntuk mengambil kembali file dengan benar ketika mereka diubah di server.

Jawaban lain memberi tahu Anda cara menekan SHIFT-F5 untuk memaksa versi Chrome Anda sendiri untuk mengambil ulang semua file. Tetapi apakah masuk akal untuk memberi tahu semua pengguna situs untuk melakukan ini setiap kali situs berubah? Jika Anda mengatur Cache-Controluntuk memasukkan must-revalidatemaka Chrome akan memeriksa untuk melihat apakah ada file yang berubah, dan kemudian mengunduhnya dengan benar ketika diperlukan.

Lihat detailnya di posting blog ini: https://agiletribe.wordpress.com/2018/01/29/caching-for-chrome/

— AgilePro
sumber