मेरी वेबसाइट के प्रदर्शन/प्रतिक्रिया में सुधार करने के लिए मैंने AJAX, replaceState, pushState, और एक पॉपस्टेट श्रोता का उपयोग करके आंशिक पृष्ठ लोड लागू किया है।आंशिक पृष्ठ लोड के साथ एचटीएमएल 5 इतिहास इतिहास एपीआई बैक बटन
मैं अनिवार्य रूप से इतिहास में अपने राज्य वस्तु के रूप में अपने पृष्ठ (एचटीएमएल) के केंद्रीय भाग को स्टोर करता हूं। जब कोई लिंक क्लिक किया जाता है तो मैं सर्वर से पृष्ठ के केंद्रीय बिट का अनुरोध करता हूं (इन अनुरोधों को एक अलग स्वीकृति शीर्षलेख के साथ पहचानना) और इसे जावास्क्रिप्ट से प्रतिस्थापित करें। पॉपस्टेट पर मैं पिछले केंद्रीय भाग को पकड़ता हूं और इसे वापस डोम में दबा देता हूं।
यह ज्यादातर ठीक काम करता है, हालांकि मुझे एक विशेष समस्या मिली है जिसे मैं फंस गया हूं। यह समझाने के लिए थोड़ा जटिल है, इसलिए माफ करना अगर यह बहुत स्पष्ट नहीं है।
हमारे अधिकांश पृष्ठों पर एक खोज फ़ॉर्म है। AJAX के माध्यम से आंशिक पृष्ठ लोडिंग केवल GET अनुरोधों पर है, और फ़ॉर्म एक पोस्ट करता है जिसके परिणामस्वरूप पूर्ण पृष्ठ लोड होता है। (पूरे पृष्ठ के माध्यम से
मुख पृष्ठ पर प्रारंभ:
मैं पृष्ठों के निम्नलिखित सेट नेविगेट करते हैं, मैं केवल केंद्रीय सामग्री से मिलकर एक विकृत आंशिक पेज को खत्म हो आसपास के डोम में से किसी के बिना, लोड) - एक खोज (पोस्ट-रीडायरेक्ट-प्राप्त करें)
आपको खोज परिणामों (पूर्ण पृष्ठ लोड के माध्यम से) पर ले जाता है - फिर होम
आपको होम पेज पर लौटाता है (गतिशील प्राप्त के माध्यम से) - ब्राउज़र पर वापस जाएं
खोज परिणाम (पॉपस्टेट श्रोता से) - ब्राउज़र पर वापस क्लिक करें
विकृत घर पेज ई।
जब विकृत होम पेज दिखाई देता है, तो मेरा पॉपस्टेट श्रोता मौजूद नहीं है।
क्या मैं सोचता हूं कि हो रहा है, यह है कि होम पेज का दूसरा लोड (गतिशील, आंशिक) ब्राउज़र द्वारा कैश किया जा रहा है, और फिर जब पूरा पृष्ठ वापस होता है, ब्राउज़र केवल कैश आंशिक दिखा रहा है पूर्ण पृष्ठ की बजाय प्रतिक्रिया।
इसे हल करने का प्रयास करने के लिए मैंने एक वैरी जोड़ा है: ब्राउज़र को यह जानने के लिए हेडर स्वीकार करें कि सामग्री स्वीकृति हेडर के आधार पर बदल सकती है। मैंने कैश-कंट्रोल अधिकतम-आयु = 0, प्रगमा नो-कैश और आंशिक लोड की गई सामग्री को पिछली समाप्ति तिथि भी जोड़ा है ताकि ब्राउजर को इसे कैश न करने के लिए मजबूर किया जा सके, लेकिन इनमें से कोई भी इसे हल नहीं करता है।
दुर्भाग्यवश मेरी कंपनी बाहरी देवता को हमारे देव सर्वरों की अनुमति नहीं देती है, इसलिए मैं आपको समस्या नहीं दिखा सकता। मैंने यहां पर कई समान प्रश्नों को देखा है, लेकिन उनमें से कोई भी काफी समान नहीं लगता है, न ही सुझाए गए समाधान काम करने लगते हैं।
यदि मैं अपने गतिशील जीईटी अनुरोधों के लिए एक बिंदु रहित पैरामीटर (blah = blah) जोड़ता हूं, तो यह समस्या हल करता है। हालांकि यह एक बदसूरत हैक है कि मैं नहीं करना चाहूंगा। ऐसा लगता है कि यह हेडर के साथ हल करने योग्य होना चाहिए, क्योंकि मुझे लगता है कि यह एक कैशिंग समस्या है। क्या कोई बता सकता है कि क्या हो रहा है?
त्वरित अपडेट - हेडर फ़ायरफ़ॉक्स पर समस्या को हल करने लगते हैं, हालांकि यह क्रोम और आईओएस सफारी (वेबकिट मुद्दा शायद?) पर रहता है –
यह कैशिंग समस्या की तरह लगता है। गतिशील जीईटी अनुरोधों में पैरामीटर जोड़ना उचित लगता है - यही jquery-pjax करता है। –