ویو روٹر ہٹائیں #

Vue Router Remove



ہسٹری وضع

ویو روٹر ڈیفالٹ ہیش موڈ - مکمل یو آر ایل کی نقالی بنانے کے لئے یو آر ایل کی ہیش کا استعمال کرتا ہے ، لہذا جب یو آر ایل تبدیل ہوتا ہے تو صفحہ دوبارہ لوڈ نہیں ہوتا ہے۔

اگر آپ بدصورت ہیش نہیں چاہتے ہیں تو ، ہم راستے کے ہسٹری موڈ کا استعمال کرسکتے ہیں۔ یہ وضع صفحہ کو دوبارہ لوڈ کیے بغیر یو آر ایل جمپ مکمل کرنے کے لئے ہسٹری۔پش اسٹیٹ API کا مکمل استعمال کرتی ہے۔



const router = new VueRouter({ mode: 'history', routes: [...] })

جب آپ ہسٹری موڈ کا استعمال کرتے ہیں تو ، URL عام URL کی طرح ہوتا ہے ، مثال کے طور پر https://yoursite.com/user/id ، یہ بھی اچھا لگتا ہے!



تاہم ، اس موڈ کو اچھی طرح سے چلانے کی ضرورت ہے اور اس کے لئے بیک گراؤنڈ کنفیگریشن سپورٹ کی ضرورت ہے۔ کیونکہ جب ہماری صارف براہ راست براؤزر تک رسائی حاصل کر رہی ہے ، اگر پس منظر کو مناسب طریقے سے تشکیل نہیں دیا گیا ہے تو ، ہماری درخواست ایک ہی صفحے کے مؤکل کی ایپلی کیشن ہے۔ http://oursite.com/user/id 404 واپس کریں گے ، جو اچھا نہیں ہے۔



لہذا ، آپ کو امیدوار کا وسیلہ شامل کرنے کی ضرورت ہے جو سرور کے سارے حالات پر محیط ہے: اگر URL کسی مستحکم وسائل سے مماثل نہیں ہے تو آپ کو وہی انڈیکس ایچ ٹی ایم ایل صفحہ واپس کرنا چاہئے ، جس صفحے پر آپ کی ایپ منحصر ہے۔

# backend configuration example # Apache RewriteEngine On RewriteBase / RewriteRule ^index.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L]

موڈ_روائٹ کے علاوہ ، آپ فیل بیک ریسورس کو بھی استعمال کرسکتے ہیں۔

# nginx location / { try_files $uri $uri/ /index.html } # Node.js const http = require('http') const fs = require('fs') const httpPort = 80 http.createServer((req, res) => { fs.readFile('index.htm', 'utf-8', (err, content) => { if (err) { console.log('We cannot open 'index.htm' file.') } res.writeHead(200, { 'Content-Type': 'text/html charset=utf-8' }) res.end(content) }) }).listen(httpPort, () => { console.log('Server listening on: http://localhost:%s', httpPort) })