क्लाइंट-साइड जावास्क्रिप्ट ऐप - यूएसएल रूटिंग बिना हैश टैग

Question

मैं एम्बर.जेएस के नवीनतम संस्करण के साथ एक नए क्लाइंट-साइड ऐप पर काम कर रहा हूं। एक एकल PHP पृष्ठ है जो स्क्रिप्ट, सीएसएस, टेम्पलेट फाइल इत्यादि बनाता है और इसे index.php में वितरित करता है। मैं एक htaccess निर्देश का उपयोग कर रहा हूँ ताकि सभी अनुरोधों को /index.php पर फिर से लिखा जा सके। जहां तक ​​मेरा संबंध है, PHP आसानी से जावास्क्रिप्ट को पैकेज करने के लिए है।

वर्तमान में, ब्राउज़र में रूट इस तरह दिखते हैं और ठीक काम करते हैं।

/#/about 
/#/favorites 
/#/etc 
/#/posts/5/edit 

हालांकि, मैं उन्हें ऐसा दिखाना चाहता हूं - जो ठीक काम नहीं करते हैं।

/about 
/favorites 
/etc 
/posts/5/edit 

ठीक उसी क्लाइंट कोड अभी भी दूसरा विकल्प के साथ वितरित किया जाता है - लेकिन यह हमेशा सूचकांक मार्ग हैंडलर पूरी करता है। मैंने क्लाइंट-साइड ऐप को पहले खींच लिया है - मुझे क्या याद आ रही है? क्या मुझे PHP पक्ष पर मिलान करने वाले रूट हैंडलर की आवश्यकता है?

संपादित करें: मैं इस दृष्टिकोण के बारे में एक विशिष्ट उत्तर की तलाश में हूं। वेब "ओह - आप बस यह" जानकारी से भरा है जो हर किसी को अपने सिर खरोंच छोड़ देता है।

Answer 1

Ember.js में (संस्करण 1.0.0rc3) इस Ember.js location API का उपयोग करके पूरा किया जा सकता है:

App.Router.reopen({ 
    location: 'history' 
}); 

और फिर एंबर आवेदन करने के लिए यातायात को रीडायरेक्ट करने वेब सर्वर की स्थापना।

यहाँ एक ठोस उदाहरण दे एक बुनियादी अपाचे .htaccess फ़ाइल index.html में स्थित एंबर आवेदन पर यातायात को रीडायरेक्ट है करने के लिए: बाहर अपाचे 2.2.16

RewriteEngine on 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteRule ^(.*)$ /index.html#$1 [L] 

Alex White के रूप में अंक और ऊपर के लिए एक सरल विन्यास का समर्थन करता है एक लक्ष्य पर यातायात को रीडायरेक्ट:

FallbackResource /index.html 

FallbackResourcemod_dir मॉड्यूल का हिस्सा है और आवश्यकता है AllowOverride Indexes स्थापित किया जाना।

आवेदन मार्गों का पूरी तरह से परीक्षण करना सुनिश्चित करें। एक सामान्य त्रुटि Uncaught SyntaxError: Unexpected token < है, जो सीएसएस और जेएस फ़ाइलों के सापेक्ष लिंक का उपयोग करके होती है। उन्हें पूर्ण बनाने के लिए / चिह्न के साथ उन्हें तैयार करें।

यह कार्यक्षमता not supported in Internet Explorer <10 है। अपने अपाचे विन्यास में

FallbackResource /index.html 

ताकि फिर से लिखना हर अनुरोध के लिए चलाने की जरूरत नहीं है:

Answer 2

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

प्लस आपको सर्वर के माध्यम से राज्य पारित करने की आवश्यकता होगी, या ब्राउज़र स्थानीय संग्रहण के कुछ संस्करण का उपयोग करना होगा।

Answer 3

@Pascal: वह वास्तविक पृष्ठ रीफ्रेश के बारे में बात नहीं कर रहा है, बल्कि का उपयोग कर एंबर के history (location: 'history')।

अपने प्रश्न का उत्तर देने के लिए, आपको जावास्क्रिप्ट को सामान्य रूप से सामग्री की सेवा के लिए अपने .htaccess को कॉन्फ़िगर करने की आवश्यकता होगी। एक बार आपके यूआरएल आपके आवेदन को लोड करने के लिए कॉन्फ़िगर किए जाने के बाद, एम्बर यूआरएल से सामान्य रूप से आपके लिए सबकुछ का ख्याल रखेगा।

Answer 4

एक RewriteRule तुलना में बेहतर है, आप अपाचे 2.2.16+ के लिए इसका उपयोग कर सकते हैं। यह सुनिश्चित करेगा कि आपके एम्बर एप्लिकेशन में हर रूट index.html फ़ाइल पर आता है।