संदेश को किस क्रॉसडोमेन iframe से जांचें (postMessage) आया था?

Question

मुझे पता है कि MessageEvent में source संपत्ति है जो विंडो ऑब्जेक्ट है जो संदेश भेजती है। अब यह जानकारी कैसे प्राप्त करें मुख्य दस्तावेज़ में iframe (और निश्चित रूप से संदेश आगमन पर मुख्य दस्तावेज़ के भीतर) उस विशेष संदेश का स्रोत था? event.source विंडो ऑब्जेक्ट पर location.href को देखने के लिए केवल उपलब्ध विकल्प है और फिर मिलान करने वाले सभी जांच करने के लिए सभी iframes लूप करें? क्या होगा यदि मुख्य दस्तावेज़ में एक ही स्रोत url के साथ iframes हैं?

Answer 1

यदि आप location.href क्रॉस-डोमेन आईफ़्रेम/विंडो की संपत्ति को पढ़ने का प्रयास करते हैं, तो यह एक अपवाद फेंक देगा क्योंकि यह उसी मूल नीति का उल्लंघन करता है। आप उस संपत्ति पर लिख सकते हैं, लेकिन आप पढ़ सकते हैं। और यहां तक ​​कि यदि यह काम करेगा, तो आपको एक ही यूआरएल समस्या के साथ कई आईफ्रेम के साथ समस्या होगी, जैसा आपने अनुमान लगाया था।

वैसे भी, आप क्या कर सकते हैं - किसी प्रकार के संदेश भेजने के लिए प्रोटोकॉल स्थापित करना। दूसरे शब्दों में, iframe में जो संदेश एक्स प्राप्त करता है, आप मूल दस्तावेज़ में सभी iframes पर पुन: प्रयास करेंगे और प्रत्येक आईफ्रेम को पर एक संदेश भेजेंगे "क्या आपने मुझे संदेश एक्स भेजा था?" और आप ऐसे प्रश्नों का उत्तर देने के लिए सभी iframes प्रोग्राम करेंगे। बेशक, आपको सभी संदेशों में अद्वितीय आईडी संलग्न करनी होंगी ताकि आप जान सकें कि कौन सा आईफ्रेम स्वीकार करता है कि उसने कौन सा संदेश भेजा है।

मुझे लगता है कि आप के बारे में क्यों संदेश के रिसीवर पता है, जो इस था की जरूरत है बारे में सोचना है, और क्यों यह काफी आपको लगता है कि इस (event.source) करने के लिए सिर्फ संदर्भ के लिए पता करने के लिए नहीं है? अगर प्रेषक को कुछ जानकारी ज्ञात है - तो प्रेषक केवल इस जानकारी को संदेश में पहले स्थान पर भेज सकता है।

Answer 2

आईफ्रेम को प्रत्येक पहल पर एक अद्वितीय आईडी पास करने के लिए एक और अधिक प्रभावी तरीका है, और पैरेंट फ्रेम पर वापस पोस्ट करते समय उन्हें उस आईडी का उपयोग करना है।

Answer 3

मैं जो कर रहा हूं वह क्रोम में अब तक काम करता है, किसी पृष्ठ पर सभी iframes पर पुनरावृत्ति करना है और window ऑब्जेक्ट्स पर पहचान तुलना करना है।

window.addEventListener('message', function(e) { 
    if(e.origin === 'https://www.example.com') { 
     var iframes = document.getElementsByTagName('iframe'); 

     for(var i = 0; i < iframes.length; i++) { 
      if(e.source === iframes[i].contentWindow) { 
       // Do stuff with iframes[i] 
      } 
     } 
    } 
} 

इस पार ब्राउज़र अभी तक जांच नहीं की है, इसलिए अपने लाभ भिन्न हो सकते हैं।