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

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

Eiji Kitamura

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

अपडेट

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

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

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

एपीआई	ब्यौरा
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

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

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

इस लेख में, इन नए हेडर को इस्तेमाल करने का तरीका बताया गया है. फ़ॉलो-अप लेख में, मैं इस बारे में ज़्यादा जानकारी और संदर्भ दूंगा.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

4. COEP चालू करना

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

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

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

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

यह कुकी, यह तय करती है कि self.crossOriginIsolated की मदद से आइसोलेशन की प्रोसेस पूरी हुई या नहीं

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

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

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

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

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

आईफ़्रेम की स्थिति देखी जा सकती है. जैसे, SharedArrayBuffer की उपलब्धता वगैरह.

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

Reporting API का इस्तेमाल करके समस्याओं का पता लगाना

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

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

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

COEP रिपोर्ट का उदाहरण

जब क्रॉस-ऑरिजिन रिसॉर्स को ब्लॉक किया जाता है, तब 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 रिपोर्ट का उदाहरण

जब कोई पॉप-अप विंडो अलग से खोली जाती है, तब 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"
}]

जब अलग-अलग ब्राउज़िंग कॉन्टेक्स्ट ग्रुप एक-दूसरे को ऐक्सेस करने की कोशिश करते हैं, तब COOP भी एक रिपोर्ट भेजता है. ऐसा सिर्फ़ "report-only" मोड पर होता है. उदाहरण के लिए, 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"
}]

नतीजा

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

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

संसाधन

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