2011-05-17 19 views
5

मैं जावास्क्रिप्ट की कुछ लाइनें का उपयोग एक iframe तत्व बनाने के लिए, और फिर मैं इसे एक संदेश भेजने के लिए इस तरह करना चाहते हैं:html5 postMessage मेरे लिए क्यों काम नहीं कर रहा है?

function loadiframe (callback) { 
    var body = document.getElementsByTagName('body')[0]; 
    var iframe = document.createElement('iframe'); 
    iframe.id = 'iframe'; 
    iframe.seamless = 'seamless'; 
    iframe.src = 'http://localhost:3000/iframe.html'; 
    body.appendChild(iframe); 
    callback(); 
} 

loadiframe(function() { 
    cpframe = document.getElementById('iframe').contentWindow; 
    cpframe.postMessage('please get this message','http://localhost:3000'); 
    console.log('posted'); 
}) 

और फिर, अंदर http://localhost:3000/iframe.html (iframe के स्रोत) है कुछ इस तरह:

<!DOCTYPE html> 
<html> 
<head> 
<title>does not work</title> 
<script> 
window.addEventListener("message", receiveMessage, false); 
function receiveMessage(event) { 
    if (event.origin == "http://localhost:3000") { 
    document.write(JSON.stringify(event)); 
    document.write(typeof event); 
    } 
} 
</script> 
</head> 
<body> 
</body> 
</html> 

लेकिन कुछ भी नहीं होता है ... मैं भी मूल के लिए सुरक्षा जांच का उपयोग नहीं करने की कोशिश की, लेकिन कुछ भी नहीं है कि यहां तक ​​कि तरह होता है ... जैसे कि यह कभी नहीं संदेश मिला ...

क्या मैं किसी प्रकार की async proble में हूं मी? मुझे यकीन है कि इससे पहले कि postMessage चले गए iframe लोड किया गया था बनाने के लिए कोशिश की ...

EDIT1: इसके अलावा, कोई त्रुटि कंसोल पर दिखा ...

EDIT2: मैं गूगल क्रोम 11 और Firefox 4 में इसे करने की कोशिश

अग्रिम धन्यवाद।

उत्तर

4

इसके दो संभावित समस्याओं हैं:

  1. आप callback कॉल कर रहे हैं इससे पहले कि चाइल्ड फ़्रेम के लोड होते ही - load स्थिति में यह कोशिश या यह एक setTimeout
  2. मैं पाने में कामयाब रहे कभी नहीं किया है में क्या postMessage मूल के रूप में '*' किसी अन्य चीज़ के साथ काम करने के लिए। अगर मैं वहां एक यूआरएल डालता हूं तो मुझे सुरक्षा चेतावनी मिलती है "सुरक्षा त्रुटि: http://xxx/ पर सामग्री http://yyy/ से डेटा लोड नहीं कर सकती है", केवल त्रुटि कंसोल (Ctrl + Shift + J) को छोड़कर किसी भी अन्य स्थान पर नहीं। मुझे संदेह है कि कुछ अन्य सामान हैं जिन्हें काम करने के लिए कहीं भी स्थापित करने की जरूरत है, लेकिन मुझे अभी तक पता नहीं चला है कि क्या।

Here's a jsfiddle अपने कोड अपने डोमेन के बंद एक दस्तावेज़ लोड का एक थोड़ा संशोधित संस्करण के साथ, फायरफॉक्स और क्रोम में मेरे लिए काम करता है।

+0

धन्यवाद रॉबर्टक, यह एक सेटटाइमआउट के साथ काम करता है और मुझे मूल के रूप में '*' सेट करने की आवश्यकता नहीं थी (सुरक्षा के लिए yay)। अब मुझे लगता है कि मैं आईफ्रेम को मूल विंडो को एक संदेश भेजूंगा जो यह बताता है कि आईफ्रेम तैयार है, और फिर विंडो संदेश भेजेगी। क्या आपको लगता है कि आगे बढ़ने का यह सही तरीका है? –

+0

@ JoãoPintoJerónimo ऐसा लगता है कि यह काम करेगा, यह 'iframe' के लिए पंजीकरण कार्यक्रम की तरह है। – robertc

+0

यह काम करता है, मुझे उम्मीद है कि यह सबसे अच्छा समाधान है। –

संबंधित मुद्दे