प्रोग्रामेटिक रूप से खाली ब्राउज़र कैश कैसे करें?


121

मैं प्रोग्रामेटिक रूप से ब्राउज़र कैश को खाली करने का एक तरीका ढूंढ रहा हूं। मैं ऐसा इसलिए कर रहा हूं क्योंकि एप्लिकेशन गोपनीय डेटा को कैश करता है और जब आप "लॉग आउट" दबाते हैं तो मैं उन्हें हटाना चाहता हूं। यह सर्वर या जावास्क्रिप्ट के माध्यम से होता है। बेशक, विदेशी / सार्वजनिक कंप्यूटर पर सॉफ़्टवेयर का उपयोग करना अभी भी हतोत्साहित किया जाता है क्योंकि कुंजी लॉगर जैसे अधिक खतरे हैं जो आप सॉफ़्टवेयर स्तर पर हार नहीं सकते हैं।


3
कौन से ब्राउज़र? आपको ब्राउज़र को यह भी देखना चाहिए कि सर्वर से कैश नहीं करना चाहिए या इसे मिटाने की कोशिश नहीं करनी चाहिए।
मेच सॉफ्टवेयर

आप कैशिंग और यह कैसे काम करता है पर इस ट्यूटोरियल की जांच करना चाहते हैं। mnot.net/cache_docs कैश कंट्रोल हेडर और उस जैसे सामान को कवर करता है
स्क्रैपेडकोला

@MechSoftware मैं तेज़ पृष्ठ लोड के लिए कैश करना चाहता हूं, लेकिन मैं लॉग ऑफ करने के बाद इसे साफ़ करना चाहता हूं। अधिमानतः जितना संभव हो उतना अच्छा ब्राउज़र समर्थन।
टॉवर

2
@rFactor कोई भी उस ब्राउज़र का उपयोग नहीं करेगा जो वेबसाइटों को अपने कैश पर नियंत्रण देता है।
NullUserException

3
डी वास्तविक वेबसाइटों का कैश पर नियंत्रण होता है, क्योंकि वे HTTP हेडर को नियंत्रित करते हैं।
दानूबियन नाविक

जवाबों:


38

यह संभव है, आप 'मेटा टैग' को स्थानापन्न करने के लिए बस jQuery का उपयोग कर सकते हैं जो एक घटना हैंडलर / बटन के साथ कैश की स्थिति को संदर्भित करता है, और फिर ताज़ा, आसान,

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

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

नोट: यह समाधान HTML 5 कल्पना के भाग के रूप में लागू किया गया है जो अनुप्रयोग कैश पर निर्भर करता है। App Cache मेनिफेस्ट को सेट करने के लिए भी सर्वर कॉन्फ़िगरेशन की आवश्यकता होती है। यह एक ऐसी विधि का वर्णन नहीं करता है जिसके द्वारा कोई क्लाइंट-या सर्वर-साइड कोड के माध्यम से 'पारंपरिक' ब्राउज़र कैश को साफ़ कर सकता है, जो करना असंभव है।


क्या यह केवल HTML5 फीचर है?
जॉन नाएले

मैं ऐसा कहूंगा, और मेरा मानना ​​है कि इसके लिए सर्वर कॉन्फ़िगरेशन (ऐप कैश मेनिफेस्ट सेट करने के लिए) की भी आवश्यकता है। हालांकि यह उत्तर मूल प्रश्न का समाधान प्रस्तुत करता है, यह इस तथ्य को अस्पष्ट करता है कि क्लाइंट या सर्वर-साइड कोड के माध्यम से पारंपरिक ब्राउज़र कैश को साफ करना असंभव है।
एरिक फुलर

यह विधि कैश को बायपास करने और सामग्री को अपडेट करने के लिए लगता है, लेकिन जब पृष्ठ को फिर से लोड किया जाता है, तो यह पहले से कैश की गई सामग्री पर वापस चला जाता है।
सरल

सेवा श्रमिकों के पक्ष में पदावनत डेवलपर developer.mozilla.org/en-US/docs/Web/HTML/…
nadav

2
सेवा कार्यकर्ता iPhones पर काम नहीं करते तो आप वहाँ एप्लिकेशन संचय का उपयोग करना
टोनी

159

नहीं है कोई रास्ता नहीं एक ब्राउज़र आप अपने कैश को साफ़ करने देगा। यदि यह संभव होता तो यह बहुत बड़ा सुरक्षा मुद्दा होता। यह बहुत आसानी से दुरुपयोग किया जा सकता है - जिस मिनट में एक ब्राउज़र ऐसी "सुविधा" का समर्थन करता है वह वह मिनट होगा जब मैं इसे अपने कंप्यूटर से अनइंस्टॉल करता हूं।

क्या आप कर सकते हैं इसे अपने पृष्ठ कैश करने के लिए नहीं, उचित हेडर इन मेटा टैग भेजने या का उपयोग करके बताने के लिए है:

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

आप प्रपत्र फ़ील्ड पर स्वतः पूर्ण को बंद करने पर विचार करना चाह सकते हैं, हालांकि मुझे डर है कि ऐसा करने का एक मानक तरीका है ( यह प्रश्न देखें )।

इसके बावजूद, मैं यह बताना चाहूंगा कि यदि आप संवेदनशील डेटा के साथ काम कर रहे हैं तो आपको एसएसएल का उपयोग करना चाहिए। यदि आप SSL का उपयोग नहीं कर रहे हैं, तो नेटवर्क तक पहुंच रखने वाला कोई भी व्यक्ति नेटवर्क ट्रैफ़िक को सूँघ सकता है और आसानी से देख सकता है कि आपका उपयोगकर्ता क्या देख रहा है।

SSL का उपयोग करना भी कुछ ब्राउज़रों को कैशिंग का उपयोग नहीं करता है जब तक कि स्पष्ट रूप से नहीं बताया जाता है। इस प्रश्न को देखें ।


8
मैं अपने उपयोगकर्ताओं को परेशान करने के लिए अपने वेब ऐप का कैश क्यों साफ़ करूंगा? मैं कैश्ड निजी डेटा के निशान को साफ करना चाहता हूं। यदि मैं ब्राउज़र को कैश नहीं करने के लिए कहता हूं, तो उसे पेज लोड होने पर हर बार क्लाइंट-साइड डेटा के मेगाबाइट का अनुरोध करना पड़ता है, जो कि न तो मैं करना चाहता हूं।
टॉवर

27
कोई नहीं होगा, क्योंकि जाहिर है कि यह संभव नहीं होगा। जैसे आप किसी अन्य मूल पर स्क्रिप्ट नहीं चला सकते, इसका मतलब यह नहीं है कि आप अपने मूल पर स्क्रिप्ट नहीं चला सकते। यदि आप किसी दूरस्थ मूल पर कैश को साफ़ नहीं कर सकते हैं, तो यह तर्कसंगत है, लेकिन मैं जिस कोड को निष्पादित कर रहा हूँ, उसके मूल कैश को साफ़ क्यों नहीं कर सका? इसका कोई कारण नहीं है, इसलिए मैं देख रहा हूं कि क्या इसका कोई हल है, लेकिन ऐसा लगता है कि यह संभव नहीं है। यदि आप इतने उत्सुक हैं तो मैं आपको बता सकता हूं कि मेरे पास बहुत सारे CSS के साथ एक बड़ा एप्लिकेशन है, HTML और JS लगभग 6 एमबी के लिए संकलित हैं।
टॉवर

4
@rFactor यह वाया बहुत ज्यादा है।
18

14
कृपया बताएं कि क्रियान्वयन में कोई फर्क नहीं पड़ता, यह एक सुरक्षा मुद्दा होगा? इसे सुरक्षित रूप से लागू किया जा सकता है।
डेन

22
हो सकता है कि कल रात मुझे पर्याप्त नींद न मिली हो, ऐसे में यह एक सुरक्षा समस्या कैसे होगी, जब कोई वेब ऐप कैश को बदल नहीं सकता है ? आप इसका फायदा कैसे उठा सकते हैं?
वोल्कर ई।

19

html का ही उपयोग करें। यह एक ऐसी ट्रिक है, जिसका उपयोग किया जा सकता है। ट्रिक स्क्रिप्ट टैग में फ़ाइल नाम के लिए एक पैरामीटर / स्ट्रिंग को जोड़ने और इसे बदलने के लिए है जब आप फ़ाइल बदलते हैं।

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

ब्राउज़र पूरे स्ट्रिंग को फ़ाइल पथ के रूप में व्याख्या करता है, भले ही "के बाद आता है?" पैरामीटर हैं। तो अब ऐसा होता है कि अगली बार जब आप अपनी फ़ाइल को अपडेट करते हैं, तो बस अपनी वेबसाइट (उदाहरण <script src="myfile.js?version=1.0.1"></script>) पर स्क्रिप्ट टैग में नंबर बदलें और प्रत्येक उपयोगकर्ता ब्राउज़र देखेंगे कि फ़ाइल बदल गई है और एक नई प्रतिलिपि ले सकती है।


1
कुछ सर्वर-साइड डायनेमिक भाषा का उपयोग करने वालों के लिए, यदि आप फ़ाइल ctime(या mtime) का उपयोग कर सकते हैं, तो आप इसके पीछे दिए गए समय को जोड़ सकते हैं। उदाहरण के लिए php में myfile.js?v=<?=filectime('myfile.js');?>, और वहाँ आप अपने आप को अपने संसाधनों के लिए एक ऑटो अद्यतन कैश मिल गया है।
पियरे-एंटोनी गुइल्यूम

मैं इस तकनीक का कई दिनों से उपयोग कर रहा था। लेकिन मैंने आज देखा कि, संस्करण को बदलने के बाद भी फ़ाइल अभी भी कैश से दी जा रही है। मैं क्रोम का उपयोग कर रहा था। सर्वर से फाइल डिलीट करने के बाद भी यह दिख रहा था। किसी को भी कोई जानकारी क्यों यह काम नहीं कर सकता है?
T

यह चाल काम करती है, stackoverflow.com/questions/1922910/…
Nevin

9

सबसे अच्छा विचार है कि नाम के साथ जेएस फाइल पीढ़ी + संस्करण के साथ कुछ हैश, अगर आपको कैश को साफ़ करने की आवश्यकता है, तो बस नई हैश के साथ नई फाइलें उत्पन्न करें, इससे नई फ़ाइलों को लोड करने के लिए ब्राउज़र ट्रिगर होगा


5

प्रारंभ में मैंने अपने html, JS में ब्राउज़र कैश को साफ़ करने के लिए विभिन्न प्रोग्रामेटिक तरीकों की कोशिश की। नवीनतम क्रोम पर कुछ भी काम नहीं करता है।

अंत में, मैं .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>

क्रोम, फ़ायरफ़ॉक्स, ओपेरा में परीक्षण किया गया

संदर्भ: https://wp-mix.com/disable-caching-htaccess/


4

location.reload (सही); कैश को अनदेखा करते हुए, वर्तमान पृष्ठ को पुनः लोड करेगा।
Cache.delete () का उपयोग नए क्रोम, फ़ायरफ़ॉक्स और ओपेरा के लिए भी किया जा सकता है।


यह फ़ंक्शन इंटरनेट एक्सप्लोरर और सफारी ब्राउज़र के साथ काम नहीं करता है। यकीन न हो तो Microsoft Edge के साथ काम करें।
जिज्ञासु डेवलपर

3

क्रोम पर, आपको बेंचमार्किंग एक्सटेंशन का उपयोग करके ऐसा करने में सक्षम होना चाहिए। आपको निम्नलिखित स्विच के साथ अपना क्रोम शुरू करने की आवश्यकता है:

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

Chrome के कंसोल में अब आप निम्न कार्य कर सकते हैं:

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

जैसा कि आप ऊपर के आदेशों से बता सकते हैं, यह न केवल ब्राउज़र कैश को साफ़ करता है, बल्कि DNS कैश को भी साफ़ करता है और नेटवर्क कनेक्शन को बंद करता है। जब आप पृष्ठ लोड समय बेंचमार्किंग कर रहे हैं तो ये बहुत अच्छे हैं। स्पष्ट रूप से आपको उन सभी का उपयोग करने की आवश्यकता नहीं है यदि आवश्यक नहीं है (उदाहरण के लिए क्लीचे () को पर्याप्त होना चाहिए यदि आपको केवल कैश को साफ़ करने की आवश्यकता है और DNS कैश और कनेक्शन के बारे में परवाह नहीं है)।


2

//The code below should be put in the "js" folder with the name "clear-browser-cache.js"

(function () {
    var process_scripts = false;
    var rep = /.*\?.*/,
    links = document.getElementsByTagName('link'),
    scripts = document.getElementsByTagName('script');
    var value = document.getElementsByName('clear-browser-cache');
    for (var i = 0; i < value.length; i++) {
        var val = value[i],
            outerHTML = val.outerHTML;
        var check = /.*value="true".*/;
        if (check.test(outerHTML)) {
            process_scripts = true;
        }
    }
    for (var i = 0; i < links.length; i++) {
        var link = links[i],
        href = link.href;
        if (rep.test(href)) {
            link.href = href + '&' + Date.now();
        }
        else {
            link.href = href + '?' + Date.now();
        }
    }
    if (process_scripts) {
        for (var i = 0; i < scripts.length; i++) {
            var script = scripts[i],
            src = script.src;
            if (src !== "") {
                if (rep.test(src)) {
                    script.src = src + '&' + Date.now();
                }
                else {
                    script.src = src + '?' + Date.now();
                }
            }
        }
    }
})();
At the end of the tah head, place the line at the code below

    < script name="clear-browser-cache" src='js/clear-browser-cache.js' value="true" >< /script >


3
यह स्पष्ट नहीं है कि यह उत्तर कैसे काम करता है और यह कई मौजूदा उत्तर से बेहतर कैसे है। यह इस बात के वर्णन के साथ बहुत सुधारा जा सकता है कि आप किस दृष्टिकोण का अनुसरण कर रहे हैं और साथ ही साथ दस्तावेज़ीकरण का समर्थन भी कर रहे हैं, जिससे पता चलता है कि काम क्यों करेगा
व्लादिमीर

सराहना करते समय, यह ब्राउज़र कैश को साफ नहीं करता है, यह सिर्फ पृष्ठ को जोड़कर दिए गए पृष्ठ पर किसी भी लिंक को कैश-बस्ट करने के लिए लगता है।
दान चेस

1

अब आप Cache.delete () का उपयोग कर सकते हैं

उदाहरण:

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)
    }
  }));

Chrome 40+, फ़ायरफ़ॉक्स 39+, ओपेरा 27+ और एज पर काम करता है।


0

कल्पना कीजिए कि .jsफाइलें अंदर रखी गई हैं/my-site/some/path/ui/js/myfile.js

तो आम तौर पर स्क्रिप्ट टैग जैसा दिखेगा:

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

अब इसे बदल दें:

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

अब निश्चित रूप से वह काम नहीं करेगा। इसे काम करने के लिए आपको अपनी एक या कुछ पंक्तियों को जोड़ने की आवश्यकता .htaccess है: महत्वपूर्ण पंक्ति है: (संपूर्ण। तल पर अतिरिक्त)

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

तो यह क्या करता है, यह 1111111111रास्ते से हटा देता है और सही रास्ते से जोड़ता है।

इसलिए अब यदि आप परिवर्तन करते हैं तो आपको बस उस नंबर 1111111111को बदलना होगा जो आप चाहते हैं। और हालाँकि आप अपनी फ़ाइलों को शामिल करते हैं आप उस नंबर को टाइमस्टैम्प के माध्यम से सेट कर सकते हैं जब js-file को अंतिम रूप से संशोधित किया गया हो। यदि संख्या नहीं बदलती है तो कैश सामान्य रूप से काम करेगा। यदि यह बदल जाता है तो यह नई फ़ाइल (YES ALWAYS) की सेवा देगा क्योंकि ब्राउज़र को एक पूर्ण नया URL मिलता है और बस विश्वास है कि फ़ाइल इतनी नई है कि उसे प्राप्त करना होगा।

आप इसके लिए इसका उपयोग कर सकते हैं CSS, faviconsऔर जो कभी भी कैश हो जाता है। CSS के लिए बस इतना ही उपयोग करें

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

और यह काम करेगा! अद्यतन करने के लिए सरल, बनाए रखने के लिए सरल।

पूरा वादा किया

यदि आपके पास अभी तक कोई .htaccess नहीं है, तो आपके लिए यह आवश्यक न्यूनतम राशि है:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    RewriteRule ^my-site\/(.*)\/ui\-([0-9]+)\/(.*) my-site/$1/ui/$3 [L]
</IfModule>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.