Storage Access API के लिए एचटीटीपी हेडर की सुविधा

Natalia Markoborodova
Natalia Markoborodova

ऑरिजिन ट्रायल के सफल होने के बाद, हम Chrome 133 में स्टोरेज ऐक्सेस हेडर (एसएएच) को शिप कर रहे हैं.

स्टोरेज ऐक्सेस हेडर क्या हैं?

स्टोरेज ऐक्सेस हेडर, नए एचटीटीपी हेडर हैं. इनकी मदद से, एम्बेड किए गए कॉन्टेंट (जैसे, सोशल मीडिया विजेट, कैलेंडर, इंटरैक्टिव टूल, और इमेज) में, बिना सेगमेंट वाली कुकी का ऐक्सेस देखा जा सकता है. पहले, ऐसा सिर्फ़ JavaScript की मदद से किया जा सकता था. नया Sec-Fetch-Storage-Access अनुरोध हेडर और Activate-Storage-Access रिस्पॉन्स हेडर, एम्बेड किए गए कॉन्टेंट पर निर्भर वेबसाइटों की परफ़ॉर्मेंस और उपयोगकर्ता अनुभव को बेहतर बनाता है. साथ ही, यह नॉन-इफ़्रेम संसाधनों को लोड करने में मदद करता है. लागू करने से जुड़ी जानकारी के लिए, दस्तावेज़ देखें.

अनुरोध का हेडर

  Sec-Fetch-Storage-Access: <access-status>

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

  • none: एम्बेड किए गए कॉन्टेंट के पास storage-access अनुमति नहीं है. इसलिए, उसके पास बिना बंटे हुए कुकी ऐक्सेस का ऐक्सेस नहीं है.

  • inactive: एम्बेड किए गए कॉन्टेंट के पास storage-access अनुमति है, लेकिन उसने अपने मौजूदा कॉन्टेक्स्ट में इसका इस्तेमाल करने के लिए ऑप्ट इन नहीं किया है. एम्बेड किए गए कॉन्टेंट में, बिना बंटवारे वाली कुकी का ऐक्सेस नहीं है.

  • active: एम्बेड किए गए ऐप्लिकेशन के पास, बिना बंटवारे वाली कुकी का ऐक्सेस है. यह वैल्यू, ऐसे सभी क्रॉस-ऑरिजिन अनुरोधों में शामिल की जाएगी जिनके पास बिना बंटे हुए कुकी का ऐक्सेस है.

रिस्पॉन्स हेडर

  Activate-Storage-Access: <retry-or-load>

Activate-Storage-Access हेडर, ब्राउज़र को कुकी के साथ अनुरोध फिर से करने या सीधे Storage Access API (SAA) के साथ संसाधन लोड करने का निर्देश देता है. हेडर में ये वैल्यू हो सकती हैं:

  • load: ब्राउज़र को निर्देश देता है कि वह अनुरोध किए गए संसाधन के लिए, एम्बेडर को बिना बंटवारे वाली कुकी का ऐक्सेस दे. अगर storage-access अनुमति दी गई है, तो इस हेडर को शामिल करना document.requestStorageAccess() को कॉल करने के बराबर है. उपयोगकर्ता को कोई और प्रॉम्प्ट नहीं दिखेगा.

  • retry: सर्वर से यह जवाब मिलता है कि ब्राउज़र को स्टोरेज ऐक्सेस करने की अनुमति चालू करनी चाहिए. इसके बाद, अनुरोध फिर से करें.

  Activate-Storage-Access: retry; allowed-origin="https://site.example"
  Activate-Storage-Access: retry; allowed-origin=*
  Activate-Storage-Access: load

मुख्य फ़ायदे

हमारा सुझाव है कि स्टोरेज ऐक्सेस एपीआई (एसएए) का इस्तेमाल करने के लिए, स्टोरेज ऐक्सेस हेडर का इस्तेमाल करें. यह तरीका ज़्यादा बेहतर परफ़ॉर्म करता है. कुल मिलाकर, इस बदलाव से कई सुधार हुए हैं:

  • नॉन-इफ़्रेम एम्बेड की सुविधा: इससे कई तरह के संसाधनों के लिए, एसएए की सुविधा चालू की जा सकती है.
  • नेटवर्क के इस्तेमाल में कमी: कम अनुरोध और छोटे पेलोड.
  • सीपीयू का कम इस्तेमाल: JavaScript प्रोसेसिंग कम होती है.
  • बेहतर यूज़र एक्सपीरियंस: बीच में आने वाले रुकावट वाले लोड को हटाता है.

अपना समाधान अपडेट करना

स्टोरेज ऐक्सेस हेडर की सुविधा के साथ, आपको इन दो मामलों में अपना कोड अपडेट करना पड़ सकता है:

  • आपने SAA का इस्तेमाल किया है और आपको आने वाले समय में storage-access अनुरोधों के लिए, हेडर लॉजिक का इस्तेमाल करके बेहतर परफ़ॉर्मेंस हासिल करनी है.
  • आपके पास पुष्टि करने या लॉजिक का विकल्प होता है. यह इस बात पर निर्भर करता है कि आपके सर्वर के अनुरोध में Origin हेडर शामिल है या नहीं.

अपने समाधान में स्टोरेज ऐक्सेस हेडर का इस्तेमाल करने का तरीका जानने के लिए, हमारा दस्तावेज़ देखें.

दर्शकों से जुड़ना और सुझाव, राय या शिकायत शेयर करना

अगर आपको कोई सुझाव/राय देनी है या कोई समस्या आ रही है, तो समस्या दर्ज करें. GitHub पर स्टोरेज ऐक्सेस हेडर के बारे में जानकारी वाले पेज पर जाकर, इस बारे में ज़्यादा जानें.