AngularJS वेबसाइट में साइट सामग्री बदलते समय index.html को कैश करने के लिए कैसे करें?

Question

आम तौर पर .js और .css फ़ाइल के लिए हम xx.js?v=123 जैसे निर्माण के दौरान एक संस्करण जोड़ देंगे, और उसके बाद वेबसाइट परिनियोजन के बाद, हम जेएस और सीएसएस का नया संस्करण प्राप्त कर सकते हैं। लेकिन मुझे वेबसाइट परिनियोजन होने पर index.html फ़ाइल अपग्रेड करने के बारे में बात करने के बारे में कोई जगह नहीं दिखाई दे रही है। और हम आईई में देखते हैं कि HTML सामग्री बदल दी जानी चाहिए लेकिन यह अभी भी पुरानी HTML सामग्री का उपयोग करती है।

एक समाधान मैं गूगल से लगता है हालांकि

<meta http-equiv="Cache-control" content="no-cache"> 

के लिए है, मुझे यकीन है कि क्या यह सबसे अच्छा समाधान है नहीं कर रहा हूँ?

Answer 1

हां, यह सही तरीका है। ब्राउज़र को यह जानने के लिए आपको Cache-Control शीर्षलेख सेट करना होगा कि उन्हें उस अनुरोध के लिए किसी भी सामग्री को कैश करने की आवश्यकता नहीं है।

<meta http-equiv="Cache-control" content="no-cache, no-store, must-revalidate"> 
<meta http-equiv="Pragma" content="no-cache"> 

(Pragma & Cache-Control एक और एक ही बात है, लेकिन अलग अलग HTTP विनिर्देशन से है इस सवाल का जवाब यहाँ देखें:। Difference between Pragma and Cache-control headers?)

संबंधित जवाब यहाँ से एक देखें: How to burst yeoman index.html cache

Answer 2

नहीं है, यह निश्चित रूप से सही तरीका नहीं है। एक से अधिक पृष्ठों वाली वेबसाइट पर विचार करें (पढ़ें: 99.9 99% वेबसाइटें) क्या आप गंभीरता से मानते हैं कि डेवलपर को प्रत्येक पृष्ठ पर स्पष्ट रूप से नो-कैश सेट करना चाहिए? इसमें कोणीय और आपके वेब-सर्वर (जो कि इंडेक्स.html फ़ाइल के अंदर क्या है, के बारे में कोई जानकारी नहीं है) के साथ कुछ भी करने के लिए कुछ भी नहीं है, गलत तरीके से फाइलों को कैश करना जैसे कि वे स्थैतिक सामग्री थे।

निश्चित रूप से जब तक आप अपने सर्वर कॉन्फ़िगरेशन को ठीक नहीं करते हैं तब तक अस्थायी उपाय के रूप में नो-कैश पर विचार करें।

Answer 3

टिप्पणियों में उल्लिखित अनुसार यह वास्तव में सर्वर कॉन्फ़िगरेशन है जिसे आप देखना चाहते हैं लेकिन आपने अपने सेटअप का उल्लेख नहीं किया है। हम आईआईएस का उपयोग करते हुए एक .NET बैकएंड के साथ हमारी AngularJS साइट चलाते हैं।

हम नियमित रूप से हमारी साइट का अद्यतन करें और जे एस और सीएसएस संसाधनों कैशिंग के साथ अतीत में मुद्दों पड़ा है, लेकिन हम निम्न सेटिंग्स के माध्यम से इसका समाधान कर लिया:

बिल्ड

हम घूंट का उपयोग हमारे निर्माण करने के लिए AngularJS एप्लिकेशन और उस के हिस्से के रूप में हम अपने मुख्य अनुप्रयोग सीएसएस और जावास्क्रिप्ट फ़ाइलों की क्वेरीस्ट्रिंग में एक संस्करण संख्या जोड़ते हैं जो अक्सर बदलते हैं। उदाहरण के लिए:

<link href="css/default.min.css?v=2" rel="stylesheet" /> 

सर्वर विन्यास

जड़ web.config में हम निर्दिष्ट है कि हम के रूप में cache-control, Pragma और Expires अनुरोध हेडर की स्थापना करके कैश करने के लिए index.html नहीं चाहता अधिकतम उम्र 0 के साथ ही।

<location path="index.html"> 
<system.webServer> 
    <staticContent> 
    <clientCache cacheControlMode="DisableCache" cacheControlMaxAge="0.00:00:00" /> 
    </staticContent> 
    <httpProtocol> 
     <customHeaders> 
      <add name="Cache-Control" value="no-cache, no-store, must-revalidate" /> 
      <add name="Pragma" value="no-cache" /> 
      <add name="Expires" value="-1" /> 
     </customHeaders> 
    </httpProtocol> 
</system.webServer> 
</location> 

संदर्भ:

• आईआईएस क्लाइंट कैश: https://docs.microsoft.com/en-us/iis/configuration/system.webserver/staticcontent/clientcache
• कैश-नियंत्रण HTTP हैडर: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control
• Pragma HTTP हैडर: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Pragma
• HTTP हेडर के समय समाप्ति: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Expires