अजाक्स, बैक बटन और डीओएम अपडेट

Question

यदि जावास्क्रिप्ट पेज ए में डीओएम को संशोधित करता है, तो उपयोगकर्ता पृष्ठ बी पर नेविगेट करता है और फिर पृष्ठ पर वापस आने के लिए वापस बटन दबाता है। पृष्ठ ए के डीओएम में सभी संशोधन खो जाते हैं और उपयोगकर्ता को प्रस्तुत किया जाता है संस्करण जो मूल रूप से सर्वर से पुनर्प्राप्त किया गया था।

यह स्टैक ओवरफ्लो, रेडडिट और कई अन्य लोकप्रिय वेबसाइटों पर इस तरह से काम करता है। (इस प्रश्न पर परीक्षण टिप्पणी जोड़ने का प्रयास करें, फिर अलग-अलग पेज पर नेविगेट करें और वापस आने के लिए वापस बटन दबाएं - आपकी टिप्पणी "चली जाएगी")

यह समझ में आता है, फिर भी कुछ वेबसाइटें (apple.com, basecamphq.com आदि) किसी भी तरह ब्राउज़र को उपयोगकर्ता की पृष्ठ की नवीनतम स्थिति प्रदान करने के लिए मजबूर कर रहे हैं। (http://www.apple.com/ca/search/?q=ipod पर जाएं, शीर्ष पर डाउनलोड लिंक लिंक पर क्लिक करें और फिर बैक बटन पर क्लिक करें - सभी डोम अपडेट संरक्षित किए जाएंगे)

असंगतता कहां से आ रही है?

Answer 1

एक उत्तर: अन्य चीजों के अलावा, अनलोड ईवेंट घटनाओं को पीछे/आगे कैश को अमान्य करने का कारण बनता है।

कुछ ब्राउज़र तथाकथित "bfcache" या "पृष्ठ कैश" में पूरे वेब पेज की वर्तमान स्थिति संग्रहीत करते हैं। यह उन्हें पीछे और आगे बटन के माध्यम से नेविगेट करते समय पृष्ठ को बहुत तेज़ी से प्रस्तुत करने की अनुमति देता है, और डोम की स्थिति और सभी जावास्क्रिप्ट चर को संरक्षित करता है। हालांकि, जब किसी पृष्ठ में ऑनलोड लोड ईवेंट होते हैं, तो वे ईवेंट संभावित रूप से पृष्ठ को गैर-कार्यात्मक स्थिति में डाल सकते हैं, और इसलिए पृष्ठ bfcache में संग्रहीत नहीं होता है और इसे पुनः लोड किया जाना चाहिए (लेकिन मानक कैश से लोड किया जा सकता है) और पुनः- सभी अधिभार हैंडलर चलाने सहित स्क्रैच से प्रस्तुत किया गया। Bfcache के माध्यम से किसी पृष्ठ पर लौटने पर, डीओएम को अपने पिछले राज्य में रखा जाता है, बिना लोडलोड हैंडलर को आग लगने की आवश्यकता के बिना (क्योंकि पृष्ठ पहले ही लोड हो चुका है)।

ध्यान दें कि कैश-कंट्रोल और अन्य HTTP शीर्षकों के संबंध में bfcache का व्यवहार मानक ब्राउज़र कैश से अलग है। कई मामलों में, ब्राउज़र bfcache में किसी पृष्ठ को कैश करेगा, भले ही वह इसे मानक कैश में संग्रहीत न करे।

jQuery स्वचालित रूप से विंडो में एक अनलोड ईवेंट संलग्न करता है, इसलिए दुर्भाग्यवश jQuery का उपयोग करके आपके पृष्ठ को डीओएम संरक्षण और त्वरित बैक/आगे के लिए bfcache में संग्रहीत होने से अयोग्य कर दिया जाएगा। [अपडेट: इस jQuery 1.4 इतना है कि यह केवल IE पर लागू होता है में तय किया गया है]

• Information about the Firefox bfcache
• Information about the Safari Page Cache और possible future changes to how unload events work
• Opera uses fast history navigation
• क्रोम एक पेज कैश नहीं है ([1], [2])
• डीओएम मैनिपुलेशन और बीएफकेएसी के साथ खेलने के लिए पेज:
  • This page will be stored in the regular cache
  • This page will not, but will still be bfcached

Answer 2

जो कुछ आप खोज रहे हैं वह कुछ प्रकार के यूआरएल हैश प्रबंधन के लिए है। यूआरएल में # केवल ग्राहक पक्ष के लिए है।

जब आप जेएस के साथ पीठ की स्थिति बदलते हैं, तो आप यूआरएल के # में डेटा अपडेट करते हैं।

इसके अलावा आप कुछ प्रकार के मतदान जोड़ते हैं जो हैश बदल गया है या नहीं, और हैश में नए डेटा के आधार पर पृष्ठ की स्थिति लोड करता है।

इस पर एक नज़र डालें:

http://ajaxpatterns.org/Unique_URLs

Answer 3

फेसबुक ajax अनुरोध के लिए URL में हैश पहचानकर्ता को संशोधित करके पेज राज्य याद रखता है। ये परिवर्तन ब्राउज़र इतिहास में दर्ज किए जाते हैं, इसलिए जब उपयोगकर्ता बैक बटन पर क्लिक करता है, तो हैश उसमें बदल जाता है जो पहले था। तो फिर यह निहित है कि आपको पहचानकर्ता की निगरानी करने के लिए कुछ जावास्क्रिप्ट की आवश्यकता होगी और जब ब्राउज़र द्वारा बदला जाता है तो प्रतिक्रिया दें। Andreas Blixt has a hash monitoring script available।

Answer 4

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

कुछ विचारों के लिए Really Simple History प्रोजेक्ट देखें। हैश में परिवर्तन के लिए यूआरएल की निगरानी करना संभव है, और आरएसएस यह खाता ब्राउज़र अंतर को ध्यान में रखते हुए करता है।

Answer 5

इसका हैश (#) प्रतीक से कोई लेना देना नहीं है।

यदि आप सेब के HTTP शीर्षलेखों की जांच करेंगे, तो यह केवल पृष्ठ को कैशिंग कर रहा है।

Answer 6

मैं सफारी की तरह व्यवहार करने के लिए क्रोम प्राप्त करने की कोशिश कर रहा है, और एक ही रास्ता मैं पाया है कि काम करता है हेडर में Cache-control: no-store स्थापित करने के लिए है। जब उपयोगकर्ता बैक बटन दबाता है तो ब्राउज़र को सर्वर से पृष्ठ को फिर से लाने के लिए मजबूर करता है। आदर्श नहीं है, लेकिन एक पुराना पृष्ठ दिखाए जाने से बेहतर है।

Answer 7

Rails के साथ समस्याओं में चल रहे किसी भी व्यक्ति के लिए और यह - आपकी समस्या bfcache नहीं है (मैंने सोचा था कि यह था) - यह turbolinks मणि है। Here यह कैसे निकालना है।

उम्मीद है कि यह आपको कुछ समय बचाएगा और दीवार के खिलाफ अपने सिर को टक्कर देगा।