COOP और COEP का इस्तेमाल करके, अपनी वेबसाइट को "क्रॉस-ऑरिजिन आइसोलेटेड" बनाना

क्रॉस-ऑरिजिन आइसोलेटेड एनवायरमेंट सेट अप करने के लिए, COOP और COEP का इस्तेमाल करें. साथ ही, SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), और बेहतर रिज़ॉल्यूशन वाले टाइमर जैसी बेहतर सुविधाओं को चालू करें.

Eiji Kitamura

चेतावनी: Chrome के डेस्कटॉप वर्शन पर SharedArrayBuffer का इस्तेमाल करने के लिए, क्रॉस-ऑरिजिन आइसोलेशन की ज़रूरत होती है. यह सुविधा, Chrome के वर्शन 92 से उपलब्ध है. ज़्यादा जानने के लिए, Android Chrome 88 और डेस्कटॉप Chrome 92 में SharedArrayBuffer से जुड़े अपडेट लेख पढ़ें.

अपडेट

• 21 जून, 2022: क्रॉस-ऑरिजिन आइसोलेशन चालू होने पर, वर्कर्स स्क्रिप्ट को भी ध्यान से इस्तेमाल करना चाहिए. कुछ जानकारी जोड़ी गई.
• 5 अगस्त, 2021: JS Self-Profiling API को उन एपीआई में से एक के तौर पर बताया गया है जिनके लिए क्रॉस-ऑरिजिन आइसोलेशन की ज़रूरत होती है. हालांकि, निर्देश में हुए हाल ही के बदलाव के मुताबिक, इसे हटा दिया गया है.
• 6 मई, 2021: हमें मिले सुझाव/राय/शिकायत और समस्याओं के आधार पर, हमने SharedArrayBuffer के इस्तेमाल की समयावधि में बदलाव करने का फ़ैसला लिया है. अब SharedArrayBuffer का इस्तेमाल, क्रॉस-ओरिजिन आइसोलेशन की सुविधा के बिना काम करने वाली साइटों पर नहीं किया जा सकेगा. यह बदलाव, Chrome M92 में लागू होगा.
• 16 अप्रैल, 2021: क्रॉस-ऑरिजिन आइसोलेशन के लिए, बिना क्रेडेंशियल वाले नए सीओईपी मोड और COOP के 'एक ही ऑरिजिन से अनुमति वाले पॉप-अप' के लिए, ज़रूरी शर्तों में ढील के बारे में नोट जोड़े गए.
• 5 मार्च, 2021: SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), और डीबग करने की सुविधाओं से जुड़ी पाबंदियां हटा दी गई हैं. ये सुविधाएं अब Chrome 89 में पूरी तरह से चालू हैं. आने वाले समय में, performance.now() और performance.timeOrigin जैसी सुविधाएं जोड़ी जाएंगी. इनकी मदद से, ज़्यादा सटीक जानकारी मिलेगी.
• 19 फ़रवरी, 2021: सुविधा से जुड़ी नीतिallow="cross-origin-isolated" और DevTools पर डीबग करने की सुविधा के बारे में नोट जोड़ा गया.
• 15 अक्टूबर, 2020: self.crossOriginIsolated, Chrome 87 से उपलब्ध है. इसका मतलब है कि जब self.crossOriginIsolated, true दिखाता है, तो document.domain में बदलाव नहीं किया जा सकता. performance.measureUserAgentSpecificMemory() का ऑरिजिन ट्रायल खत्म हो रहा है और यह Chrome 89 में डिफ़ॉल्ट रूप से चालू है. Android Chrome पर शेयर किया गया अरे बफ़र, Chrome 88 से उपलब्ध होगा.

कुछ वेब एपीआई, Spectre जैसे साइड-चैनल अटैक का खतरा बढ़ाते हैं. इस जोखिम को कम करने के लिए, ब्राउज़र ऑप्ट-इन के आधार पर अलग-अलग एनवायरमेंट उपलब्ध कराते हैं. इसे क्रॉस-ऑरिजिन आइसोलेशन कहा जाता है. क्रॉस-ऑरिजिन से अलग किए गए वेबपेज पर, ऐक्सेस की सुविधाओं का इस्तेमाल किया जा सकता है. इनमें ये सुविधाएं शामिल हैं:

वे सुविधाएं जो क्रॉस-ऑरिजिन आइसोलेटेड मोड में उपलब्ध होंगी.

एपीआई	ब्यौरा
SharedArrayBuffer	WebAssembly थ्रेड के लिए ज़रूरी है. यह सुविधा, Android के लिए उपलब्ध है Chrome 88 से. फ़िलहाल, डेस्कटॉप वर्शन साइट आइसोलेशन की मदद से डिफ़ॉल्ट रूप से चालू होता है. हालांकि, इसके लिए क्रॉस-ऑरिजिन आइसोलेशन की ज़रूरत होगी. साथ ही, Chrome 92 में यह सुविधा डिफ़ॉल्ट रूप से बंद रहेगी.
performance.measureUserAgentSpecificMemory()	यह सुविधा, Chrome 89 से उपलब्ध है.
performance.now(), performance.timeOrigin	फ़िलहाल, यह सुविधा कई ब्राउज़र में उपलब्ध है. हालांकि, इनमें रिज़ॉल्यूशन 100 माइक्रोसेकंड या उससे ज़्यादा तक सीमित है. क्रॉस-ऑरिजिन आइसोलेशन की मदद से, रिज़ॉल्यूशन 5 माइक्रोसेकंड या उससे ज़्यादा हो सकता है.

क्रॉस-ऑरिजिन आइसोलेशन की स्थिति, document.domain में बदलाव होने से भी रोकती है. (document.domain में बदलाव करने से, एक ही साइट के दस्तावेज़ों के बीच कम्यूनिकेशन की अनुमति मिलती है. इसे एक ही ऑरिजिन से जुड़ी नीति में एक खामी माना गया है.)

क्रॉस-ऑरिजिन आइसोलेशन की सुविधा के लिए ऑप्ट इन करने के लिए, आपको मुख्य दस्तावेज़ पर ये एचटीटीपी हेडर भेजने होंगे:

Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin

ये हेडर, ब्राउज़र को उन संसाधनों या iframes को लोड करने से रोकने का निर्देश देते हैं जिन्होंने क्रॉस-ऑरिजिन दस्तावेज़ों से लोड होने के लिए ऑप्ट इन नहीं किया है. साथ ही, क्रॉस-ऑरिजिन विंडो को आपके दस्तावेज़ के साथ सीधे इंटरैक्ट करने से रोकते हैं. इसका मतलब यह भी है कि क्रॉस-ऑरिजिन से लोड किए जा रहे संसाधनों के लिए ऑप्ट-इन करना ज़रूरी है.

self.crossOriginIsolated की जांच करके यह पता लगाया जा सकता है कि कोई वेब पेज, क्रॉस-ओरिजिन आइसोलेटेड स्टेटस में है या नहीं.

इस लेख में, इन नए हेडर को इस्तेमाल करने का तरीका बताया गया है. इसके बाद के लेख में, हम इस बारे में ज़्यादा जानकारी देंगे.

ध्यान दें: यह लेख उन लोगों के लिए है जो अपनी वेबसाइटों को SharedArrayBuffer, WebAssembly थ्रेड, performance.measureUserAgentSpecificMemory() या हाई रिज़ॉल्यूशन टाइमर का इस्तेमाल करने के लिए तैयार करना चाहते हैं. साथ ही, वे चाहते हैं कि उनकी वेबसाइटें सभी ब्राउज़र प्लैटफ़ॉर्म पर बेहतर तरीके से काम करें.

मुख्य शब्द: इस लेख में, एक जैसी लगने वाली कई शब्दावली का इस्तेमाल किया गया है. इनके बारे में बेहतर तरीके से समझने के लिए, पहले इनकी परिभाषा जानें: * सीओईपी: क्रॉस-ओरिजिन एम्बेडर नीति * सीओओपी: क्रॉस-ओरिजिन ओपनर नीति * सीओआरपी: क्रॉस-ओरिजिन रिसॉर्स नीति * सीओआरएस: क्रॉस-ओरिजिन रिसॉर्स शेयरिंग * सीओआरबी: क्रॉस-ओरिजिन रीड ब्लॉकिंग

अपनी वेबसाइट को क्रॉस-ऑरिजिन आइसोलेट करने के लिए, COOP और COEP को डिप्लॉय करना

ध्यान दें: क्रॉस-ऑरिजिन आइसोलेशन चालू करने की गाइड में जाकर, क्रॉस-ऑरिजिन आइसोलेशन को चालू करने के बारे में जानें.

COOP और COEP को इंटिग्रेट करना

1. टॉप-लेवल दस्तावेज़ पर Cross-Origin-Opener-Policy: same-origin हेडर सेट करना

किसी टॉप-लेवल दस्तावेज़ पर COOP: same-origin को चालू करने पर, एक ही ऑरिजिन वाली विंडो और दस्तावेज़ से खोली गई विंडो का अलग ब्राउज़िंग कॉन्टेक्स्ट ग्रुप होगा. ऐसा तब तक होगा, जब तक वे एक ही ऑरिजिन में एक ही सीओओपी सेटिंग में नहीं होतीं. इसलिए, खुली हुई विंडो के लिए अलगाव लागू किया जाता है और दोनों विंडो के बीच आपस में कम्यूनिकेशन बंद कर दिया जाता है.

चेतावनी: इससे ऐसे इंटिग्रेशन काम नहीं करेंगे जिनके लिए क्रॉस-ऑरिजिन विंडो इंटरैक्शन की ज़रूरत होती है. जैसे, OAuth और पेमेंट. इस समस्या को कम करने के लिए, हम Cross-Origin-Opener-Policy: same-origin-allow-popups के लिए क्रॉस-ऑरिजिन आइसोलेशन की सुविधा चालू करने के मकसद से, शर्तों को आसान बनाने की कोशिश कर रहे हैं. इस तरह, अपने-आप खुलने वाली विंडो के साथ कम्यूनिकेट किया जा सकेगा. अगर आपको क्रॉस-ऑरिजिन आइसोलेशन की सुविधा चालू करनी है, लेकिन इस समस्या की वजह से ऐसा नहीं हो पा रहा है, तो हमारा सुझाव है कि आप ऑरिजिन ट्रायल के लिए रजिस्टर करें और नई शर्त उपलब्ध होने तक इंतज़ार करें. जब तक इस समस्या का सुरक्षित तरीके से समाधान नहीं हो जाता, तब तक हम ऑरिजिन ट्रायल को बंद नहीं करेंगे.

ब्राउज़िंग कॉन्टेक्स्ट ग्रुप, विंडो का एक सेट होता है. ये विंडो एक-दूसरे का रेफ़रंस दे सकती हैं. उदाहरण के लिए, <iframe> की मदद से एम्बेड किया गया टॉप-लेवल दस्तावेज़ और उसके चाइल्ड दस्तावेज़. अगर कोई वेबसाइट (https://a.example) पॉप-अप विंडो (https://b.example) खोलती है, तो खोलने वाली विंडो और पॉप-अप विंडो, एक ही ब्राउज़िंग कॉन्टेक्स्ट शेयर करती हैं. इसलिए, window.opener जैसे DOM API की मदद से, दोनों एक-दूसरे का ऐक्सेस पा लेती हैं.

DevTools से यह देखा जा सकता है कि विंडो खोलने वाला और उसे खोलने वाला व्यक्ति, अलग-अलग ब्राउज़िंग कॉन्टेक्स्ट ग्रुप में है या नहीं.

इसे आज़माएं: अलग-अलग सीओओपी पैरामीटर का असर देखें.

2. पक्का करें कि संसाधनों में सीओआरपी या सीओआरएस की सुविधा चालू हो

पक्का करें कि पेज के सभी संसाधन, CORP या CORS एचटीटीपी हेडर के साथ लोड किए गए हों. यह चरण, चौथे चरण, सीओईपी को चालू करने के लिए ज़रूरी है.

संसाधन के टाइप के आधार पर, आपको ये काम करने होंगे:

• अगर रिसॉर्स को सिर्फ़ एक ही ऑरिजिन से लोड किया जाना है, तो Cross-Origin-Resource-Policy: same-origin हेडर सेट करें.
• अगर रिसॉर्स को सिर्फ़ एक ही साइट से, क्रॉस ऑरिजिन के तौर पर लोड किया जाना है, तो Cross-Origin-Resource-Policy: same-site हेडर सेट करें.
• अगर रिसॉर्स आपके कंट्रोल में क्रॉस ऑरिजिन से लोड किया गया है, तो जहां तक हो सके Cross-Origin-Resource-Policy: cross-origin हेडर सेट करें.
• ऐसे क्रॉस-ऑरिजिन रिसॉर्स के लिए जिन पर आपका कंट्रोल नहीं है:
  • अगर संसाधन को सीओआरएस के साथ दिखाया जाता है, तो लोड करने वाले एचटीएमएल टैग में crossorigin एट्रिब्यूट का इस्तेमाल करें. (उदाहरण के लिए, <img src="***" crossorigin>.)
  • रिसॉर्स के मालिक से CORS या CORP का इस्तेमाल करने के लिए कहें.
• iframes के लिए, ऊपर दिए गए सिद्धांतों का पालन करें और Cross-Origin-Resource-Policy: cross-origin (या same-site, same-origin, संदर्भ के हिसाब से) सेट करें.
• WebWorker के साथ लोड की गई स्क्रिप्ट, एक ही ऑरिजिन से दिखाई जानी चाहिए, ताकि आपको सीओआरपी या सीओआरएस हेडर की ज़रूरत न पड़े.
• COEP: require-corp के साथ दिखाए गए दस्तावेज़ या वर्कर्स के लिए, सीओआरएस के बिना लोड किए गए क्रॉस-ऑरिजिन सब-रिसॉर्स को एम्बेड करने के लिए, Cross-Origin-Resource-Policy: cross-origin हेडर सेट करना होगा. उदाहरण के लिए, यह <script>, importScripts, <link>, <video>, <iframe> वगैरह पर लागू होता है.

iframe में एम्बेड किए गए दस्तावेज़ पर, क्रॉस-ऑरिजिन आइसोलेशन की सुविधा चालू की जा सकती है. इसके लिए, <iframe> टैग पर allow="cross-origin-isolated" अनुमतियों की नीति लागू करें और इस दस्तावेज़ में बताई गई शर्तों को पूरा करें. ध्यान दें कि दस्तावेज़ों की पूरी चेन, जिसमें पेरंट फ़्रेम और चाइल्ड फ़्रेम शामिल हैं, उन्हें भी अलग-अलग ऑरिजिन के तौर पर अलग किया जाना चाहिए.

खास शब्द: यह समझना ज़रूरी है कि "same-site" और "same-origin" के बीच क्या अंतर है. एक ही साइट और एक ही ऑरिजिन को समझना लेख में, इनके बीच के अंतर के बारे में जानें.

3. एम्बेड किए गए संसाधनों का आकलन करने के लिए, सिर्फ़ रिपोर्ट के लिए इस्तेमाल होने वाले COEP एचटीटीपी हेडर का इस्तेमाल करना

सीओईपी को पूरी तरह से चालू करने से पहले, Cross-Origin-Embedder-Policy-Report-Only हेडर का इस्तेमाल करके ड्राई रन किया जा सकता है. इससे यह पता चलता है कि नीति असल में काम करती है या नहीं. आपको एम्बेड किए गए कॉन्टेंट को ब्लॉक किए बिना रिपोर्ट मिलेंगी.

इसे सभी दस्तावेज़ों पर बार-बार लागू करें. इनमें टॉप-लेवल दस्तावेज़, इंटरफ़्रेम, और वर्कर्स स्क्रिप्ट शामिल हैं. सिर्फ़ रिपोर्ट के लिए इस्तेमाल किए जाने वाले एचटीटीपी हेडर के बारे में जानकारी पाने के लिए, Reporting API का इस्तेमाल करके समस्याओं को देखना लेख पढ़ें.

4. सीओईपी चालू करना

जब यह पक्का हो जाए कि सब कुछ काम कर रहा है और सभी रिसॉर्स को सही तरीके से लोड किया जा सकता है, तो सभी दस्तावेज़ों के लिए Cross-Origin-Embedder-Policy-Report-Only हेडर को Cross-Origin-Embedder-Policy हेडर पर स्विच करें. इसमें वे दस्तावेज़ भी शामिल हैं जिन्हें iframes और वर्कर्स स्क्रिप्ट की मदद से एम्बेड किया गया है.

इसे आज़माएं: अलग-अलग सीओईपी / सीओआरपी पैरामीटर का असर देखें.

ध्यान दें: Squoosh (इमेज ऑप्टिमाइज़ेशन वाला PWA) अब Android Chrome पर भी Wasm थ्रेड (और शेयर किए गए कलेक्शन के बफ़र) का ऐक्सेस पाने के लिए, COOP / COEP का इस्तेमाल करता है.

अहम जानकारी: हम बड़े पैमाने पर Cross-Origin-Resource-Policy को डिप्लॉय करने के तरीकों पर काम कर रहे हैं. ऐसा इसलिए, क्योंकि क्रॉस-ऑरिजिन आइसोलेशन के लिए, सभी सब-रिसॉर्स को साफ़ तौर पर ऑप्ट-इन करना ज़रूरी है. इसलिए, हमने इसके उलट एक नया तरीका अपनाया है: एक नया सीओईपी "बिना क्रेडेंशियल वाला" मोड. इसकी मदद से, सभी क्रेडेंशियल हटाकर, सीओआरपी हेडर के बिना संसाधन लोड किए जा सकते हैं. हमें उम्मीद है कि इससे आपको यह पक्का करने में आसानी होगी कि सब-रिसॉर्स, Cross-Origin-Resource-Policy हेडर भेज रहे हैं या नहीं. हालांकि, credentialless मोड, Chrome के 96 वर्शन से उपलब्ध है, लेकिन फ़िलहाल यह किसी दूसरे ब्राउज़र पर काम नहीं करता. इसलिए, हो सकता है कि कुछ डेवलपर को COOP या COEP को डिप्लॉय करने में समस्या आएं. अगर आपको अभी क्रॉस-ऑरिजिन आइसोलेशन की सुविधा चालू नहीं करनी है, तो हमारा सुझाव है कि आप ऑरिजिन ट्रायल के लिए रजिस्टर करें और तब तक इंतज़ार करें, जब तक credentialless ज़्यादा ब्राउज़र में उपलब्ध न हो जाए.

यह पता लगाना कि self.crossOriginIsolated की मदद से आइसोलेशन किया जा सका या नहीं

जब वेब पेज, क्रॉस-ऑरिजिन से अलग होने की स्थिति में होता है और सभी रिसॉर्स और विंडो एक ही ब्राउज़िंग कॉन्टेक्स्ट ग्रुप में अलग-अलग होती हैं, तो self.crossOriginIsolated प्रॉपर्टी true दिखाती है. इस एपीआई का इस्तेमाल करके यह पता लगाया जा सकता है कि आपने ब्राउज़िंग कॉन्टेक्स्ट ग्रुप को अलग किया है या नहीं. साथ ही, performance.measureUserAgentSpecificMemory() जैसी बेहतर सुविधाओं का ऐक्सेस मिला है या नहीं.

Chrome DevTools का इस्तेमाल करके समस्याओं को डीबग करना

स्क्रीन पर रेंडर किए जाने वाले संसाधनों, जैसे कि इमेज के लिए, सीओईपी से जुड़ी समस्याओं का पता लगाना काफ़ी आसान है. ऐसा इसलिए, क्योंकि अनुरोध को ब्लॉक कर दिया जाएगा और पेज पर यह जानकारी दिखेगी कि इमेज मौजूद नहीं है. हालांकि, स्क्रिप्ट या स्टाइल जैसे ऐसे रिसॉर्स के लिए, सीओईपी से जुड़ी समस्याओं का पता नहीं चलता जिनका विज़ुअल पर ज़रूरी तौर पर असर नहीं पड़ता. इसके लिए, DevTools के नेटवर्क पैनल का इस्तेमाल करें. अगर सीओईपी में कोई समस्या है, तो आपको स्टेटस कॉलम में (blocked:NotSameOriginAfterDefaultedToSameOriginByCoep) दिखेगा.

इसके बाद, ज़्यादा जानकारी देखने के लिए एंट्री पर क्लिक करें.

ऐप्लिकेशन पैनल की मदद से भी, iframe और पॉप-अप विंडो की स्थिति देखी जा सकती है. बाईं ओर मौजूद "फ़्रेम" सेक्शन पर जाएं और संसाधन के स्ट्रक्चर का ब्रेकडाउन देखने के लिए, "टॉप" को बड़ा करें.

इससे आपको iframe की स्थिति के बारे में जानकारी मिलती है. जैसे, SharedArrayBuffer की उपलब्धता वगैरह के बारे में जानकारी मिलती है.

पॉप-अप विंडो की स्थिति भी देखी जा सकती है. जैसे, यह क्रॉस-ऑरिजिन से अलग है या नहीं.

Reporting API का इस्तेमाल करके समस्याओं को देखना

Reporting API एक और तरीका है, जिसकी मदद से कई समस्याओं का पता लगाया जा सकता है. Reporting API को कॉन्फ़िगर करके, उपयोगकर्ताओं के ब्राउज़र को यह निर्देश दिया जा सकता है कि जब भी सीओईपी किसी संसाधन को लोड होने से रोके या सीओओपी किसी पॉप-अप विंडो को अलग करे, तब रिपोर्ट भेजे. Chrome के 69 वर्शन से, Reporting API का इस्तेमाल किया जा सकता है. इसे कई कामों के लिए इस्तेमाल किया जा सकता है. जैसे, COEP और COOP.

ध्यान दें: क्या Report-To हेडर के साथ Reporting API का इस्तेमाल पहले से किया जा रहा है? Chrome, Reporting API के नए वर्शन पर ट्रांज़िशन कर रहा है. इसमें Report-To की जगह Reporting-Endpoints लेगा. इसलिए, नए वर्शन पर माइग्रेट करें. ज़्यादा जानकारी के लिए, Reporting API v1 पर माइग्रेट करना लेख पढ़ें.

Reporting API को कॉन्फ़िगर करने और रिपोर्ट पाने के लिए सर्वर सेट अप करने का तरीका जानने के लिए, Reporting API का इस्तेमाल करना लेख पढ़ें.

सीओईपी रिपोर्ट का उदाहरण

क्रॉस-ऑरिजिन रिसॉर्स के ब्लॉक होने पर, COEP रिपोर्ट पेलोड का उदाहरण कुछ ऐसा दिखता है:

[{
  "age": 25101,
  "body": {
    "blocked-url": "https://third-party-test.glitch.me/check.svg?",
    "blockedURL": "https://third-party-test.glitch.me/check.svg?",
    "destination": "image",
    "disposition": "enforce",
    "type": "corp"
  },
  "type": "coep",
  "url": "https://cross-origin-isolation.glitch.me/?coep=require-corp&coop=same-origin&",
  "user_agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4249.0 Safari/537.36"
}]

चेतावनी: blocked-url सिर्फ़ पुराने सिस्टम के साथ काम करने की सुविधा के लिए है और इसे जल्द ही हटा दिया जाएगा.

सीओओपी रिपोर्ट का उदाहरण

पॉप-अप विंडो को अलग से खोलने पर, COOP report के पेलोड का उदाहरण ऐसा दिखता है:

[{
  "age": 7,
  "body": {
    "disposition": "enforce",
    "effectivePolicy": "same-origin",
    "nextResponseURL": "https://third-party-test.glitch.me/popup?report-only&coop=same-origin&",
    "type": "navigation-from-response"
  },
  "type": "coop",
  "url": "https://cross-origin-isolation.glitch.me/coop?coop=same-origin&",
  "user_agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4246.0 Safari/537.36"
}]

जब अलग-अलग ब्राउज़िंग कॉन्टेक्स्ट ग्रुप, एक-दूसरे को ऐक्सेस करने की कोशिश करते हैं (सिर्फ़ "सिर्फ़ रिपोर्ट" मोड में), तो सीओओपी भी एक रिपोर्ट भेजता है. उदाहरण के लिए, postMessage() को ऐक्सेस करने की कोशिश करने पर मिलने वाली रिपोर्ट इस तरह दिखेगी:

[{
  "age": 51785,
  "body": {
    "columnNumber": 18,
    "disposition": "reporting",
    "effectivePolicy": "same-origin",
    "lineNumber": 83,
    "property": "postMessage",
    "sourceFile": "https://cross-origin-isolation.glitch.me/popup.js",
    "type": "access-from-coop-page-to-openee"
  },
  "type": "coop",
  "url": "https://cross-origin-isolation.glitch.me/coop?report-only&coop=same-origin&",
  "user_agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4246.0 Safari/537.36"
},
{
  "age": 51785,
  "body": {
    "disposition": "reporting",
    "effectivePolicy": "same-origin",
    "property": "postMessage",
    "type": "access-to-coop-page-from-openee"
  },
  "type": "coop",
  "url": "https://cross-origin-isolation.glitch.me/coop?report-only&coop=same-origin&",
  "user_agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4246.0 Safari/537.36"
}]

नतीजा

किसी वेब पेज को क्रॉस-ऑरिजिन से अलग करने के लिए, COOP और COEP एचटीटीपी हेडर का इस्तेमाल करें. self.crossOriginIsolated की जांच करके यह पता लगाया जा सकता है कि कोई वेब पेज, क्रॉस-ऑरिजिन से अलग है या नहीं.

इस पोस्ट को अपडेट किया जाएगा, क्योंकि क्रॉस-ऑरिजिन से अलग किए गए इस स्टेटस के लिए नई सुविधाएं उपलब्ध कराई जाएंगी. साथ ही, DevTools में COOP और COEP से जुड़े सुधार किए जाएंगे.

संसाधन

• बेहतर सुविधाओं के लिए, "अलग-अलग सोर्स से आने वाले अनुरोधों को अलग-अलग सेशन में रखना" सुविधा की ज़रूरत क्यों है
• क्रॉस-ऑरिजिन आइसोलेशन को चालू करने के लिए गाइड
• Android के लिए Chrome 88 और डेस्कटॉप के लिए Chrome 92 में, SharedArrayBuffer से जुड़े अपडेट
• measureUserAgentSpecificMemory() की मदद से, अपने वेब पेज के कुल मेमोरी इस्तेमाल पर नज़र रखना