एक जैसी ऑरिजिन नीति & फ़ेच करने के अनुरोध

इस कोडलैब में, देखें कि संसाधन फ़ेच करते समय एक ही ऑरिजिन कैसे काम करता है.

सेट अप करें: एक ही ऑरिजिन से पेज फ़ेच करें

यह डेमो https://same-origin-policy-fetch.glitch.me पर होस्ट किया गया है. यह सामान्य वेब पेज, https://same-origin-policy-fetch.glitch.me/fetch.html से संसाधन लोड करने के लिए fetch का इस्तेमाल करता है. index.html और fetch.html का ऑरिजिन एक ही है. इसलिए, आपको लाइव झलक में 200 दिखेगा.

1. किसी दूसरे ऑरिजिन से पेज फ़ेच करें

डेटा फ़ेच करने के यूआरएल को बदलकर, https://www.google.com करने की कोशिश करें. आपको लाइव झलक में क्या दिख रहा है?

आपने एक संसाधन का अनुरोध किया था, इसलिए ब्राउज़र ने फ़ेच करने के अनुरोध को ब्लॉक कर दिया होगा एक अलग ऑरिजिन से है. इसका मतलब है कि कोई हमलावर क्रॉस-ऑरिजिन को नहीं पढ़ सकता संसाधन भी उपलब्ध कराए जाते हैं, भले ही उन्होंने उपयोगकर्ता के ब्राउज़र को कंट्रोल किया हो.

2. क्रॉस-ऑरिजिन रिसॉर्स फ़ेच करना

डेटा फ़ेच करने के लिए, यूआरएल को https://api.thecatapi.com/v1/images/search में बदलें. आपको लाइव झलक में क्या दिख रहा है?

फ़ेच किए गए यूआरएल का ऑरिजिन अलग है, लेकिन आपको स्टेटस कोड 200 दिखना चाहिए. क्यों? मॉडर्न वेब ऐप्लिकेशन लोड करने के लिए, अक्सर क्रॉस-ऑरिजिन रिसॉर्स का अनुरोध करते हैं तीसरे पक्ष की स्क्रिप्ट या एपीआई एंडपॉइंट पर क्वेरी चलाई जाती हैं. इस्तेमाल के इन उदाहरणों को शामिल करने के लिए, सीओआरएस (क्रॉस ऑरिजिन रिसॉर्स शेयरिंग) नाम का एक तरीका है. यह तरीका अपनाकर, क्रॉस-ऑरिजिन रिसॉर्स लोड करने वाले ब्राउज़र की अनुमति है. सीओआरएस के बारे में ज़्यादा जानकारी के लिए, क्रॉस-ऑरिजिन संसाधनों को सुरक्षित तरीके से शेयर करें लेख पढ़ें.