Using postMessage in iframes, IE 8 & 9

Add-in Express™ Support Service
That's what is more important than anything else

Using postMessage in iframes, IE 8 & 9
 
Frank Oyer




Posts: 11
Joined: 2012-10-25
I've been struggling with this now for a while. I finally broke down and picked up a copy of add-in-express hoping it would make my life easier but I don't know..

I got this bit of code working just fine on my machine with IE 9, but I can't get it to work on IE 8.

Inside IEModule_DocumentComplete2:


            IE.IWebBrowser browser = IEApp as IE.IWebBrowser;
            doc = browser.Document as mshtml.HTMLDocument;

                    mshtml.IHTMLIFrameElement iframeNew = (mshtml.IHTMLIFrameElement)doc.createElement("iframe");
                    mshtml.IHTMLElement iframe2 = (mshtml.IHTMLElement)iframeNew;
                    iframe2.setAttribute("id", "iframe-id");
                    iframe2.setAttribute("style", "width: 330px; height: 500px; border: 0px none; position: fixed; bottom: 0px; right: 0px; padding: 0px; line-height: 1em; z-index: 2147483647; margin-right: 10px;background-color:#cccccc;");
                    iframe2.setAttribute("src", "http://mysite.com/iframe.php");
                    ((mshtml.HTMLDocument)doc).appendChild((mshtml.IHTMLDOMNode)iframe2);


doc.parentWindow     .execScript("var iframe = docu ment.getElementById('iframe-id'); iframe.onl oad = f unction() { a lert('yup..'); iframe.contentWindow     .postMessage('TESTTTTT!!!!','*'); };", "JScript");



*the bbcode is messing up the formatting and syntax

iframe.php contains an event listener for onmessage, in IE 9 it will alert the data of the postMessage, but it does not work in IE 8 and I'm ready to pull my hair out. I hope someone can assist. Let me know if I can provide any more information.
Posted 25 Oct, 2012 10:50:31 Top
Sergey Grischenko


Add-in Express team


Posts: 7202
Joined: 2004-07-05
Hi Frank,

Ok, I will test it on my PC.
Did you google the issue? Probably someone has already encountered the issue.
Posted 25 Oct, 2012 11:43:58 Top
Frank Oyer




Posts: 11
Joined: 2012-10-25
Hi Sergey, unless I'm not using the right keywords in google, it seems like not many people have used postmessage in a BHO. Before I started using ADX, I searched like crazy but I didn't even get this far. Post message wouldn't work at all.

I will say that it does work if I do this: (postmessage to itself) inside execScript or just a script injected into the head:


parent.postMessage("MESSAGE","*");

window .attachEvent("onmessage", f unction(e) { a lert(e.data); }, false);


So it will postmessage to parent, but not iframe.contentWindow ..?
Posted 25 Oct, 2012 12:45:41 Top
Sergey Grischenko


Add-in Express team


Posts: 7202
Joined: 2004-07-05
Hi Frank,

What do you need postmessage for? Probably we can find another solution for you.
Posted 26 Oct, 2012 05:49:39 Top
Frank Oyer




Posts: 11
Joined: 2012-10-25
Hello Sergey, I need postMessage to communicate from the extension to the injected iframe. The iframe is created by javascript, when the BHO inserts the javascript to the head of the page. The iframe listens on attachEvent or AddEventListner. You see this iframe is called by addons within chrome, firefox and safari. Which all handle it fine.
Posted 29 Oct, 2012 09:58:39 Top
Frank Oyer




Posts: 11
Joined: 2012-10-25
So nobody has an answer as to why IE 8 does not seem to support postMessage across domains, but it does in IE 9 with Add-In-Express for VS 2012?
Posted 30 Oct, 2012 14:10:35 Top
Sergey Grischenko


Add-in Express team


Posts: 7202
Joined: 2004-07-05
Posted 31 Oct, 2012 05:19:53 Top
Frank Oyer




Posts: 11
Joined: 2012-10-25
??
I'm confused? I have no problems building a simple HTML file that IE 8 postMessages to the iframe. I basically copied exactly what I am doing in the HTML, and I tried to implement it using add-in-express and it is not working.

THIS WORKS IN IE8:

<ht ml>
<head>
<title>IE TEST</title>
<sc ript type="text/javascript">

window   .onl oad = f unction() {
	var iframe = docu ment.getElementById("1");
	a lert(iframe.src);
	iframe.contentWindow   .postMessage('{"message":"init"}',"*");
};

</sc ript>
</head>
<body>

<ifr ame id="1" src="http://iframe.php" ></iframe>

</body>
</html>


But if I try and create and take that javascript code, inject it into the head of the web document, then use execScript to postMessage it doesn't work! :(
Posted 31 Oct, 2012 10:08:02 Top
Frank Oyer




Posts: 11
Joined: 2012-10-25
And this does not work in Add-in-express addon:


string jav * ascript = @"
window  .onl oad = f unction() {
    a lert('onloaded');
    var iframe = docu ment.createElement('iframe');
    iframe.setAttribute('src', 'http://www.website.com/iframe.php');
    iframe.id = '1';
    docu ment.getElementsByTagName('body')[0].appendChild(iframe);

    iframe.contentWindow  .postMessage('send message','*'); 
};
";

mshtml.IHTMLElement head = (mshtml.IHTMLElement)((mshtml.IHTMLElementCollection)doc.all.tags("head")).item(null, 0);
mshtml.IHTMLScriptElement scriptObject = (mshtml.IHTMLScriptElement)doc.createElement("script");
scriptObject.type = "text/javascript";
scriptObject.text = javascript;
((mshtml.HTMLHeadElement)head).appendChild((mshtml.IHTMLDOMNode)scriptObject);


The iframe is being created and injected into the dom (You can see the iframe in the developer console). But the iframe.contentWindow .postMessage does not send message. Let me say again that if I copy this code right into an HTML document, and load it up in IE 8 it works fine. So I really believe it is something to do with add-in-express, or something I am not doing right inside the addon..
Posted 31 Oct, 2012 10:26:17 Top
Frank Oyer




Posts: 11
Joined: 2012-10-25
It also doesn't work at all in windows 8 and and IE 10.. No iframe injected, nothing.
Posted 31 Oct, 2012 11:19:40 Top