Chrome, document.domain में बदलाव करने की सुविधा बंद करता है

अगर आपकी वेबसाइट, document.domain सेट करने पर निर्भर करती है, तो आपको कार्रवाई करनी होगी.

Maud Nalpas
Maud Nalpas
X GitHub
Eiji Kitamura

क्या बदल रहा है और क्यों?

Chrome 115 से, वेबसाइटें document.domain सेट नहीं कर पाएंगी: Chrome, document.domain को बदलने से रोक देगा. अलग-अलग ऑरिजिन के बीच डेटा भेजने के लिए, आपको postMessage() या Channel Messaging API जैसे अन्य तरीकों का इस्तेमाल करना होगा.

ध्यान दें कि यह बदलाव धीरे-धीरे रोल आउट किया जाएगा.

हमें उम्मीद है कि अन्य ब्राउज़र भी इस सुविधा को बंद कर देंगे और उसे हटा देंगे. ज़्यादा जानकारी के लिए, ब्राउज़र के साथ काम करने की सुविधा सेक्शन देखें.

document.domain को अपरिवर्तनीय क्यों बनाया जाए?

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

यह एक आसान तरीका है, लेकिन इससे सुरक्षा से जुड़ा जोखिम होता है. ऐसा इसलिए, क्योंकि इससे एक ही ऑरिजिन की नीति को कमज़ोर किया जाता है. document.domain से जुड़ी सुरक्षा से जुड़ी चिंताओं की वजह से, स्पेसिफ़िकेशन में बदलाव किया गया है. इसमें उपयोगकर्ताओं को इसका इस्तेमाल करने से बचने की चेतावनी दी गई है.

ज़्यादा जानकारी: document.domain को अपरिवर्तनीय क्यों बनाया गया है?

document.domain का इस्तेमाल आज कैसे किया जाता है

कई वेबसाइटें document.domain को सेट करती हैं, ताकि एक ही साइट के क्रॉस-ऑरिजिन पेजों के बीच कम्यूनिकेशन की अनुमति मिल सके.

एक ही साइट पर मौजूद, क्रॉस-ऑरिजिन साइटों का एक ही eTLD+1 होता है, लेकिन अलग-अलग सबडोमेन होते हैं.

document.domain का इस्तेमाल अब तक इस तरह किया जाता था:

मान लें कि https://parent.example.com पर मौजूद कोई पेज, https://video.example.com से iframe पेज को एम्बेड करता है. इन पेजों का eTLD+1 (example.com) एक ही है, लेकिन सबडोमेन अलग-अलग हैं. जब दोनों पेजों का document.domain, 'example.com' पर सेट होता है, तो ब्राउज़र दोनों ऑरिजिन को एक ही ऑरिजिन मानता है.

https://parent.example.com के लिए document.domain सेट करें:

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

https://video.example.com के लिए document.domain सेट करें:

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

अब https://video.example.com के ख़िलाफ़, https://parent.example.com पर क्रॉस-ऑरिजिन डीओएम मैनिपुलेशन बनाया जा सकता है.

वेबसाइटें document.domain सेट करती हैं, ताकि एक ही साइट के दस्तावेज़ों के बीच आसानी से जानकारी शेयर की जा सके. इस बदलाव की वजह से, एक ही ऑरिजिन से जुड़ी नीति में ढील मिलती है. इसलिए, पैरंट पेज, iframe के दस्तावेज़ को ऐक्सेस कर सकता है और डीओएम ट्री को ट्रैवर्स कर सकता है. इसके अलावा, iframe भी पैरंट पेज के दस्तावेज़ को ऐक्सेस कर सकता है और डीओएम ट्री को ट्रैवर्स कर सकता है.

यह एक आसान तरीका है. हालांकि, इससे सुरक्षा से जुड़ा जोखिम भी होता है.

document.domain से जुड़ी सुरक्षा से जुड़ी समस्याएं

document.domain से जुड़ी सुरक्षा से जुड़ी समस्याओं की वजह से, स्पेसिफ़िकेशन में बदलाव किया गया है. इसमें उपयोगकर्ताओं को इस सुविधा का इस्तेमाल करने से बचने के लिए चेतावनी दी गई है.

उदाहरण के लिए, जब दो पेज document.domain सेट करते हैं, तो वे ऐसा दिखा सकते हैं कि वे एक ही ऑरिजिन के हैं. यह खास तौर पर तब ज़रूरी होता है, जब ये पेज अलग-अलग सबडोमेन के साथ, शेयर की गई होस्टिंग सेवा का इस्तेमाल करते हैं. document.domain सेटिंग से, उसी सेवा की होस्ट की गई सभी अन्य साइटों का ऐक्सेस मिल जाता है. इससे, हमलावर आपकी साइटों को आसानी से ऐक्सेस कर पाते हैं. ऐसा इसलिए हो सकता है, क्योंकि document.domain, डोमेन के पोर्ट नंबर वाले हिस्से को अनदेखा करता है.

document.domain सेट करने से सुरक्षा पर पड़ने वाले असर के बारे में ज़्यादा जानने के लिए, MDN पर "Document.domain" पेज पढ़ें.

ब्राउज़र के साथ काम करना

मुझे कैसे पता चलेगा कि मेरी साइट पर असर पड़ा है या नहीं?

अगर इस बदलाव से आपकी वेबसाइट पर असर पड़ता है, तो Chrome आपको DevTools के 'समस्याएं' पैनल में चेतावनी देगा. यह चेतावनी 2022 में जोड़ी गई है. DevTools के सबसे ऊपर दाईं ओर मौजूद पीले रंग के फ़्लैग पर ध्यान दें.

DevTools में समस्या की चेतावनी का स्क्रीनशॉट

LightHouse के ऐसे एपीआई के ऑडिट की मदद से भी अपनी साइट को चलाया जा सकता है जिन्हें Chrome से हटाने के लिए शेड्यूल किया गया है.

अगर आपने Reporting API सेट अप किया है, तो Chrome ने आपको इस सुविधा के बंद होने की सूचना देने के लिए, बंद होने की रिपोर्ट भेजी हैं. रिपोर्ट इकट्ठा करने वाली मौजूदा सेवाओं या अपना इन-हाउस समाधान बनाकर, Reporting API का इस्तेमाल करने के तरीके के बारे में ज़्यादा जानें.

मैं यह बदलाव कैसे देखूं?

यह बदलाव Chrome 115 से धीरे-धीरे रोल आउट किया जाएगा. अगर यह बदलाव आपके Chrome ब्राउज़र में पहले से रोल आउट नहीं हुआ है, तो इसे देखने के लिए इसे इस तरह चालू करें:

  1. chrome://flags/#origin-agent-cluster-default खोलें
  2. चालू करें को चुनें.
  3. Chrome को रीस्टार्ट करें.

मेरे पास कौनसे विकल्प हैं?

सबसे अच्छा विकल्प यह है कि document.domain में कोई बदलाव न किया जाए. उदाहरण के लिए, पेज और सभी कॉम्पोनेंट फ़्रेम को एक ही ऑरिजिन पर होस्ट करके. यह सभी ब्राउज़र के सभी वर्शन में काम करता है. हालांकि, इसके लिए ऐप्लिकेशन में काफ़ी बदलाव करने पड़ सकते हैं. इसलिए, ऐसे विकल्पों पर भी ध्यान देना चाहिए जो क्रॉस-ऑरिजिन ऐक्सेस की सुविधा देते रहें.

document.domain के बजाय, postMessage() या Channel Messaging API का इस्तेमाल करें

ज़्यादातर मामलों में, क्रॉस-ऑरिजिन postMessage() या Channel Messaging API का इस्तेमाल करके, document.domain की जगह कोई दूसरा एट्रिब्यूट इस्तेमाल किया जा सकता है.

नीचे दिए गए उदाहरण में:

  1. https://parent.example.com, postMessage() के ज़रिए मैसेज भेजकर, डीओएम में बदलाव करने के लिए, https://video.example.com से अनुरोध करता है.
  2. https://video.example.com मैसेज मिलने के तुरंत बाद, डीओएम में बदलाव करता है और पैरंट को इसकी सूचना देता है.
  3. https://parent.example.com इस बात की पुष्टि करता है.

https://parent.example.com पर:

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

https://video.example.com पर:

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

इसे आज़माकर देखें कि यह कैसे काम करती है. अगर आपके पास ऐसी खास ज़रूरतें हैं जो postMessage() या Channel Messaging API के साथ काम नहीं करेंगी, तो हमें Twitter पर @ChromiumDev के ज़रिए बताएं या document.domain टैग के साथ Stack Overflow पर पूछें.

आखिरी विकल्प के तौर पर, Origin-Agent-Cluster: ?0 हेडर भेजें

अगर आपके पास document.domain सेट करना जारी रखने की कोई खास वजह है, तो टारगेट किए गए दस्तावेज़ के साथ Origin-Agent-Cluster: ?0 रिस्पॉन्स हेडर भेजा जा सकता है.

Origin-Agent-Cluster: ?0

Origin-Agent-Cluster हेडर, ब्राउज़र को निर्देश देता है कि दस्तावेज़ को ऑरिजिन के हिसाब से बने एजेंट क्लस्टर से मैनेज किया जाना चाहिए या नहीं. Origin-Agent-Cluster के बारे में ज़्यादा जानने के लिए, Origin-Agent-Cluster हेडर की मदद से परफ़ॉर्मेंस को अलग करने का अनुरोध करना लेख पढ़ें.

यह हेडर भेजने पर, आपका दस्तावेज़ डिफ़ॉल्ट रूप से बदलाव न किए जाने की स्थिति में होने के बाद भी document.domain सेट करना जारी रख सकता है.

जिन अन्य दस्तावेज़ों के लिए यह व्यवहार ज़रूरी है उन्हें भी Origin-Agent-Cluster भेजना होगा. ध्यान दें कि अगर सिर्फ़ एक दस्तावेज़ में document.domain सेट किया जाता है, तो इसका कोई असर नहीं पड़ता.

एंटरप्राइज़ नीति के लिए OriginAgentClusterDefaultEnabled को कॉन्फ़िगर करना

आपका एडमिन, OriginAgentClusterDefaultEnabled नीति को false पर कॉन्फ़िगर कर सकता है, ताकि आपके पूरे संगठन में Chrome इंस्टेंस पर document.domain को डिफ़ॉल्ट रूप से सेट किया जा सके. ज़्यादा जानने के लिए, Chrome Enterprise की नीति की सूची और मैनेजमेंट | दस्तावेज़ पढ़ें.

संसाधन

आभार

Unsplash पर फ़िनान अकबर की फ़ोटो