इतिहास.pushState और पेज रीफ्रेश

Question

मैंने एचटीएमएल 5 नए इतिहास एपीआई

पर ध्यान देना शुरू किया, हालांकि, मेरे पास एक सवाल है। पेज रीफ्रेश कैसे हो सकता है?

उदाहरण के लिए कोई उपयोगकर्ता किसी लिंक है, जो एक js समारोह द्वारा नियंत्रित किया जाता है, जो

एसिंक्रोनस रूप से पेज

की सामग्री लोड करता है पर क्लिक करता है history.pushState()

साथ URL परिवर्तन उपयोगकर्ता पृष्ठ को रीफ्रेश करता है, लेकिन पाठ्यक्रम का URL सर्वर पर मौजूद नहीं है

आप इस तरह की स्थितियों को कैसे संभालेंगे? हैश समाधान के साथ वहां कोई नहीं मुद्दा

धन्यवाद

Answer 1

आपको कॉपी और पेस्ट किए गए नकली URL के लिए सर्वर साइड रीडायरेक्शन करने की आवश्यकता है यह सब उस सर्वर साइड टेक्नोलॉजी पर निर्भर करता है जिसका आप उपयोग कर रहे हैं। कोई जावास्क्रिप्ट तरीका नहीं है लेकिन आपके 404 पेज में पागल फ़ंक्शन लिख रहा है जो उपयोगकर्ता को आने वाले यूआरएल के आधार पर रीडायरेक्ट करता है जो एक अच्छा समाधान नहीं है।

Answer 2

उपयोगकर्ता पेज ताज़ा करता है, लेकिन निश्चित रूप से यूआरएल सर्वर

आप से क्या मतलब है पर मौजूद नहीं है था इस? मुझे लगता है कि आपकी धारणा गलत है। दरअसल हां, मुद्दा यह है कि यह डेवलपर है जो यूआरएल-टू-पेजेटेट पत्राचार के कार्यान्वयन (सर्वरसाइड या क्लाइंटसाइड) प्रदान करना चाहिए।

यदि, एक बार फिर, मुझे प्रश्न सही हो गया है।

Answer 3

इसके लिए सर्वर-साइड समर्थन की आवश्यकता होती है। .pushState का आदर्श उपयोग जावास्क्रिप्ट अनुप्रयोगों से यूआरएल को समझदारी से सर्वर द्वारा संभालने की अनुमति देना है।

यह या तो एक ही जावास्क्रिप्ट एप्लिकेशन को फिर से सेवारत कर सकता है, और इसे window.location का निरीक्षण करने या सर्वर पर उस यूआरएल पर सामग्री को प्रस्तुत करके सामान्य वेब एप्लिकेशन के रूप में प्रस्तुत करने के लिए किया जा सकता है। आप जो भी कर रहे हैं उसके आधार पर विनिर्देश स्पष्ट रूप से भिन्न होते हैं।

Answer 4

आप अपने सर्वर पर ASP.NET MVC का उपयोग कर रहे हैं, तो आप अपने RegisterRoutes समारोह के लिए निम्न जोड़ सकते हैं:

 routes.MapRoute(
      name: "Default", 
      url: "{*url}", 
      defaults: new { controller = "Home", action = "Index" } 
     ); 

यह आपके HomeController सूचकांक कार्रवाई करने के लिए सभी अनुरोधों को भेज देंगे और अपने यूआई संभाल लेंगे वास्तविक मार्ग

Answer 5

जेएस-केवल समाधान की तलाश करने वाले लोगों के लिए, window पर popstate ईवेंट का उपयोग करें। कृपया पूर्ण विवरण के लिए MDN - popstate देखें, लेकिन अनिवार्य रूप से यह ईवेंट pushState या replaceState पर दी गई राज्य वस्तु को पारित कर दिया गया है। आप इस ऑब्जेक्ट को event.state जैसे एक्सेस कर सकते हैं और यह निर्धारित करने के लिए इसका डेटा उपयोग कर सकते हैं कि क्या करना है, यानी किसी पृष्ठ का AJAX भाग दिखाएं।

मुझे यकीन नहीं है कि यह 2011 में अनुपलब्ध था लेकिन यह अब सभी आधुनिक ब्राउज़रों (आईई 10 +) में उपलब्ध है।