لوکل ہوسٹ (Localhost) اب بھی CORS ایررز کیوں پیدا کرتا ہے
آپ اپنا فرنٹ اینڈ (frontend) localhost:3000 پر چلاتے ہیں۔ آپ اپنا بیک اینڈ (backend) localhost:5000 پر چلاتے ہیں۔ دونوں ایپس آپ کے لیپ ٹاپ پر موجود ہیں۔ اس کے باوجود، آپ کو CORS ایرر نظر آتا ہے۔
ایسا اس وجہ سے ہوتا ہے کہ براؤزرز 'origin' کی تعریف کیسے کرتے ہیں۔
ایک origin تین حصوں پر مشتمل ہوتا ہے:
- Protocol
- Domain
- Port
ان دونوں کا موازنہ کریں:
ان کا پروٹوکول (protocol) ایک ہی ہے۔ ان کا ڈومین (domain) ایک ہی ہے۔ لیکن یہ مختلف پورٹس (ports) استعمال کرتے ہیں۔
براؤزرز مختلف پورٹس کو مختلف origins کے طور پر دیکھتے ہیں۔
جب آپ کی React ایپ آپ کی API کو کال کرتی ہے، تو براؤزر اسے ایک cross-origin request کے طور پر دیکھتا ہے۔ وہ انہیں دو الگ الگ اکائیاں (entities) سمجھتا ہے۔
یہ اصول کیوں موجود ہے؟ سیکیورٹی (Security) کے لیے۔
اگر ویب سائٹس آزادانہ طور پر کسی بھی API کو کال کر سکیں، تو ایک بدنیتی پر مبنی (malicious) سائٹ یہ کر سکتی ہے:
- آپ کا بینک ڈیٹا پڑھ سکتی ہے۔
- پرائیویٹ APIs تک رسائی حاصل کر سکتی ہے۔
- آپ کی جگہ (on your behalf) کام کر سکتی ہے۔
براؤزرز اسے روکنے کے لیے Same-Origin Policy کا استعمال کرتے ہیں۔ ویب سائٹ A، ویب سائٹ B تک رسائی حاصل نہیں کر سکتی جب تک کہ ویب سائٹ B اجازت نہ دے دے۔
CORS کا مطلب Cross-Origin Resource Sharing ہے۔ یہ آپ کے سرور کا براؤزر کو بتانے کا ایک طریقہ ہے کہ: "میں اس مخصوص origin سے آنے والی درخواستوں پر بھروسہ کرتا ہوں۔"
آپ اسے اپنے بیک اینڈ میں ایک ہیڈر (header) شامل کر کے ٹھیک کر سکتے ہیں:
Access-Control-Allow-Origin: http://localhost:3000
یہ براؤزر کو بتاتا ہے کہ درخواست محفوظ ہے۔
الجھن کا ایک عام مقام: آپ دیکھتے ہیں کہ درخواست آپ کے بیک اینڈ لاگز (logs) تک پہنچ گئی ہے، لیکن فرنٹ اینڈ فیل ہو جاتا ہے۔
ایسا اس لیے ہوتا ہے کیونکہ:
- فرنٹ اینڈ درخواست بھیجتا ہے۔
- بیک اینڈ کامیابی سے درخواست وصول کرتا ہے۔
- بیک اینڈ کامیابی سے جواب (response) بھیجتا ہے۔
- براؤزر جواب وصول کرتا ہے اور سیکیورٹی قوانین کی وجہ سے اسے بلاک کر دیتا ہے۔
یہ ایرر براؤزر کا ایک سیکیورٹی فیچر ہے۔
Postman یا cURL جیسے ٹولز اس لیے کام کرتے ہیں کیونکہ وہ براؤزرز نہیں ہیں۔ وہ براؤزر کی سیکیورٹی پالیسیوں پر عمل درآمد نہیں کرتے۔
براؤزر اس حقیقت کو نظر انداز کر دیتا ہے کہ دونوں ایپس آپ کی مشین پر موجود ہیں۔ اسے صرف origin سے مطلب ہے۔