Bagaimana cara mengosongkan cache browser secara terprogram?

Saya mencari cara untuk mengosongkan cache browser secara terprogram. Saya melakukan ini karena aplikasi menyimpan data rahasia dan saya ingin menghapusnya saat Anda menekan "log out". Ini akan terjadi baik melalui server atau JavaScript. Tentu saja, menggunakan perangkat lunak pada komputer asing / publik masih tidak disarankan karena ada lebih banyak bahaya seperti key logger yang tidak dapat Anda kalahkan pada tingkat perangkat lunak.

Mungkin saja, Anda cukup menggunakan jQuery untuk mengganti 'tag meta' yang mereferensikan status cache dengan tombol / pengendali peristiwa, lalu menyegarkan, mudah,

$('.button').click(function() {
    $.ajax({
        url: "",
        context: document.body,
        success: function(s,x){

            $('html[manifest=saveappoffline.appcache]').attr('content', '');
                $(this).html(s);
        }
    }); 
});

CATATAN: Solusi ini bergantung pada Cache Aplikasi yang diterapkan sebagai bagian dari spesifikasi HTML 5. Ini juga membutuhkan konfigurasi server untuk menyiapkan manifes App Cache. Ini tidak menjelaskan metode yang dengannya seseorang dapat menghapus cache browser 'tradisional' melalui kode sisi klien atau server, yang hampir tidak mungkin dilakukan.

Tidak mungkin browser akan membiarkan Anda menghapus cache-nya. Ini akan menjadi masalah keamanan yang sangat besar jika itu memungkinkan. Ini bisa sangat mudah disalahgunakan - begitu browser mendukung "fitur" seperti itu adalah saat saya mencopot pemasangannya dari komputer saya.

Apa yang dapat Anda lakukan adalah memberitahukannya agar tidak menyimpan halaman Anda, dengan mengirimkan header yang sesuai atau menggunakan tag meta berikut:

<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>

Anda mungkin juga ingin mempertimbangkan untuk menonaktifkan pelengkapan otomatis di bidang formulir, meskipun saya khawatir ada cara standar untuk melakukannya ( lihat pertanyaan ini ).

Terlepas dari itu, saya ingin menunjukkan bahwa jika Anda bekerja dengan data sensitif, Anda harus menggunakan SSL. Jika Anda tidak menggunakan SSL, siapa pun yang memiliki akses ke jaringan dapat mengendus lalu lintas jaringan dan dengan mudah melihat apa yang dilihat pengguna Anda.

Menggunakan SSL juga membuat beberapa browser tidak menggunakan caching kecuali secara eksplisit diperintahkan. Lihat pertanyaan ini .

menggunakan html itu sendiri. Ada satu trik yang bisa digunakan. Triknya adalah menambahkan parameter / string ke nama file di tag skrip dan mengubahnya saat Anda mengubah file.

<script src="myfile.js?version=1.0.0"></script>

Browser menafsirkan seluruh string sebagai jalur file meskipun apa yang muncul setelah "?" adalah parameter. Jadi apa yang terjadi sekarang adalah waktu berikutnya ketika Anda memperbarui file Anda, cukup ubah nomor di tag skrip di situs web Anda (Contoh <script src="myfile.js?version=1.0.1"></script>) dan setiap browser pengguna akan melihat file telah berubah dan mengambil salinan baru.

Ide terbaik adalah membuat pembuatan file js dengan nama + beberapa hash dengan versi, jika Anda memang perlu menghapus cache, cukup buat file baru dengan hash baru, ini akan memicu browser untuk memuat file baru

Awalnya saya mencoba berbagai pendekatan programatik di html saya, JS untuk membersihkan cache browser. Tidak ada yang berfungsi di Chrome terbaru.

Akhirnya, saya berakhir dengan .htaccess:

<IfModule mod_headers.c>
    Header set Cache-Control "no-cache, no-store, must-revalidate"
    Header set Pragma "no-cache"
    Header set Expires 0
</IfModule>

Diuji di Chrome, Firefox, Opera

Referensi: https://wp-mix.com/disable-caching-htaccess/

location.reload (true); akan memuat ulang halaman saat ini dengan susah payah, mengabaikan cache.
Cache.delete () juga dapat digunakan untuk chrome, firefox, dan opera baru.

Di Chrome, Anda dapat melakukan ini menggunakan ekstensi pembandingan. Anda perlu memulai chrome Anda dengan sakelar berikut:

./chrome --enable-benchmarking --enable-net-benchmarking 

Di konsol Chrome sekarang Anda dapat melakukan hal berikut:

chrome.benchmarking.clearCache();
chrome.benchmarking.clearHostResolverCache();
chrome.benchmarking.clearPredictorCache();
chrome.benchmarking.closeConnections();

Seperti yang Anda ketahui dari perintah di atas, ini tidak hanya membersihkan cache browser, tetapi juga membersihkan cache DNS dan menutup koneksi jaringan. Ini bagus saat Anda melakukan pembandingan waktu buka halaman. Jelas Anda tidak perlu menggunakan semuanya jika tidak diperlukan (misalnya clearCache () sudah cukup jika Anda hanya perlu menghapus cache dan tidak peduli dengan cache dan koneksi DNS).

Anda sekarang dapat menggunakan Cache.delete ()

Contoh:

let id = "your-cache-id";
// you can find the id by going to 
// application>storage>cache storage 
// (minus the page url at the end)
// in your chrome developer console 

caches.open(id)
.then(cache => cache.keys()
  .then(keys => {
    for (let key of keys) {
      cache.delete(key)
    }
  }));

Bekerja di Chrome 40+, Firefox 39+, Opera 27+, dan Edge.

Bayangkan .jsfile ditempatkan di/my-site/some/path/ui/js/myfile.js

Jadi biasanya tag skrip akan terlihat seperti:

<script src="/my-site/some/path/ui/js/myfile.js"></script>

Sekarang ubah itu menjadi:

<script src="/my-site/some/path/ui-1111111111/js/myfile.js"></script>

Sekarang tentu saja itu tidak akan berhasil. Untuk membuatnya bekerja, Anda perlu menambahkan satu atau beberapa baris ke .htaccess baris yang penting: (seluruh .htaccess di bagian bawah)

RewriteRule ^my-site\/(.*)\/ui\-([0-9]+)\/(.*) my-site/$1/ui/$3 [L]

Jadi apa yang dilakukannya adalah, ini semacam menghapus 1111111111dari jalan dan menghubungkan ke jalan yang benar.

Jadi sekarang jika Anda melakukan perubahan, Anda hanya perlu mengubah angkanya 1111111111menjadi nomor apa pun yang Anda inginkan. Dan bagaimanapun Anda memasukkan file Anda, Anda dapat mengatur nomor itu melalui stempel waktu ketika file js terakhir diubah. Jadi cache akan bekerja normal jika jumlahnya tidak berubah. Jika berubah, itu akan menyajikan file baru (YA SELALU) karena browser mendapatkan URL baru yang lengkap dan hanya percaya bahwa file tersebut sangat baru sehingga dia harus mendapatkannya.

Anda dapat menggunakan ini untuk CSS, faviconsdan apa pun yang disimpan dalam cache. Untuk CSS gunakan saja seperti itu

<link href="http://my-domain.com/my-site/some/path/ui-1492513798/css/page.css" type="text/css" rel="stylesheet">

Dan itu akan berhasil! Sederhana untuk diperbarui, mudah dirawat.

.Htaccess penuh yang dijanjikan

Jika Anda belum memiliki .htaccess, ini adalah jumlah minimum yang Anda butuhkan:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    RewriteRule ^my-site\/(.*)\/ui\-([0-9]+)\/(.*) my-site/$1/ui/$3 [L]
</IfModule>