Cinevva

हिन्दी

English
简体中文
한국어

हिन्दी

English
简体中文
한국어

थीम

Cross-Origin Isolation Checker ​

किसी भी साइट का URL डालें और जानें कि वह cross-origin isolated है या नहीं, और क्या वहां SharedArrayBuffer तथा multithreaded WebAssembly काम करेंगे। यह checker उस URL के Cross-Origin-Opener-Policy और Cross-Origin-Embedder-Policy response headers पढ़ता है और बताता है कि क्या कमी है। यह सिर्फ headers पढ़ता है, और कुछ भी fetch या store नहीं करता।

Web Games के लिए Cross-Origin Isolation क्यों मायने रखता है ​

ब्राउज़र की कुछ सबसे काम की क्षमताएं cross-origin isolation के पीछे बंद रहती हैं, और games के लिए सबसे बड़ी है SharedArrayBuffer, यानी वह shared memory जो multithreaded WebAssembly को संभव बनाती है। अगर आपका engine एक threaded web build भेजता है, तो इसके बिना वह नहीं चलेगा:

  • Godot के web exports को पहले SharedArrayBuffer चाहिए होता था (Godot 4.3+ ने headers से बचने के लिए एक single-threaded export जोड़ा)।
  • Unity के multithreaded WebGL builds को इसकी जरूरत होती है।
  • Emscripten pthreads, ffmpeg.wasm, और कई physics तथा codec libraries को भी इसकी जरूरत होती है।

Isolation के बिना ब्राउज़र high-resolution timers और performance.measureUserAgentSpecificMemory() भी रोक लेता है। तो अगर कोई threaded game चुपचाप load होने में नाकाम रहे, या performance.now() संदेहास्पद रूप से मोटा (coarse) दिखे, तो सबसे पहले isolation check चलाना चाहिए।

Cross-Origin Isolation कैसे काम करता है ​

एक पेज तब cross-origin isolated बनता है जब वह HTML document पर ये दो response headers भेजता है:

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

COOP: same-origin पेज को उन दूसरी windows से काट देता है जो same-origin नहीं हैं। COEP: require-corp कहता है कि हर subresource को embed होने के लिए साफ तौर पर सहमति देनी होगी। जब दोनों set होते हैं, तो self.crossOriginIsolated true हो जाता है और SharedArrayBuffer unlock हो जाता है।

पेच COEP में है: एक बार यह on हो जाए, तो हर cross-origin resource (CDN images, fonts, scripts, iframes) को या तो Cross-Origin-Resource-Policy: cross-origin भेजना होगा या CORS के साथ fetch होना होगा, वरना ब्राउज़र उसे block कर देता है। यही वह हिस्सा है जो आमतौर पर साइटों को तोड़ देता है। अगर आप अपने third-party resources पर control नहीं रख सकते, तो इसके बजाय Cross-Origin-Embedder-Policy: credentialless इस्तेमाल करें, जो cross-origin resources को बिना credentials के load करता है और उनसे सहमति की मांग नहीं करता।

इसे कैसे चालू करें ​

Cloudflare Pages (एक _headers file):

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

Vite dev server (vite.config.js):

js
export default {
  server: {
    headers: {
      'Cross-Origin-Opener-Policy': 'same-origin',
      'Cross-Origin-Embedder-Policy': 'require-corp',
    },
  },
}

nginx:

add_header Cross-Origin-Opener-Policy same-origin;
add_header Cross-Origin-Embedder-Policy require-corp;

itch.io: अपने HTML game के embed options में "SharedArrayBuffer support" चालू करें, जो headers आपके लिए set कर देता है।

Deploy करने के बाद, reload करें और checker फिर से चलाएं। crossOriginIsolated को true हो जाना चाहिए।

आम सवाल ​

मैं कैसे जांचूं कि मेरा पेज cross-origin isolated है या नहीं? ​

ऊपर दिए checker में अपनी साइट का URL डालें। यह server-side पर पेज के Cross-Origin-Opener-Policy और Cross-Origin-Embedder-Policy headers पढ़ता है और बताता है कि यह combination पेज को isolated बनाता है या नहीं। अपने ही ब्राउज़र में runtime check के लिए, पेज खोलें और console में crossOriginIsolated चलाएं, जो isolation active होने पर true लौटाता है।

SharedArrayBuffer undefined क्यों है? ​

ब्राउज़र SharedArrayBuffer को सिर्फ cross-origin isolated पेजों पर ही expose करते हैं। अगर यह undefined है, तो आपके पेज पर Cross-Origin-Opener-Policy: same-origin और Cross-Origin-Embedder-Policy: require-corp headers नहीं हैं, या COEP के तहत कोई cross-origin resource isolation को block कर रहा है। headers set करें (ऊपर देखें) और दोबारा test करें।

COOP और COEP क्या हैं? ​

Cross-Origin-Opener-Policy (COOP) तय करता है कि कोई पेज दूसरी browsing windows के साथ कैसे interact करता है। Cross-Origin-Embedder-Policy (COEP) तय करता है कि कौन-से subresources embed हो सकते हैं। COOP: same-origin और COEP: require-corp को साथ में set करने से पेज cross-origin isolated बन जाता है, जो SharedArrayBuffer और दूसरी ताकतवर सुविधाओं को unlock करता है।

मेरा WebAssembly game ब्राउज़र में load नहीं हो रहा। क्या यही वजह है? ​

अक्सर, हां। Threaded WebAssembly builds (कुछ Godot और Unity web exports, Emscripten pthreads, ffmpeg.wasm) को SharedArrayBuffer चाहिए, जिसके लिए cross-origin isolation जरूरी है। अगर ऊपर का checker "not isolated" दिखाए, तो COOP/COEP headers set करें, या जहां उपलब्ध हो वहां engine का single-threaded build इस्तेमाल करें।

क्या मुझे Cross-Origin-Resource-Policy header चाहिए? ​

जिस पेज को आप isolate कर रहे हैं, उस पर नहीं। COOP और COEP ही किसी document को cross-origin isolated बनाते हैं, और वे document पर लगते हैं। Cross-Origin-Resource-Policy (CORP) एक अलग, उल्टी दिशा का header है: आप इसे किसी cross-origin resource (एक image, font, या script) पर लगाते हैं ताकि COEP: require-corp इस्तेमाल करने वाले पेज को उसे embed करने की अनुमति मिले। तो अगर checker आपके पेज पर CORP "not set" दिखाए, तो यह अपेक्षित है और ठीक है। CORP आप सिर्फ उन्हीं assets में जोड़ेंगे जिन्हें दूसरे isolated पेजों को load करना है।

क्या COEP चालू करने से मेरे third-party embeds टूट जाते हैं? ​

टूट सकते हैं। COEP: require-corp के साथ, हर cross-origin resource को या तो Cross-Origin-Resource-Policy भेजना होगा या CORS इस्तेमाल करना होगा, वरना वह block हो जाता है। अगर आप CDN assets या ऐसे third-party scripts embed करते हैं जो आपके control में नहीं हैं, तो इसके बजाय COEP: credentialless इस्तेमाल करें, जो इस जरूरत से बचाता है।

संबंधित ​