Zobrazují se příspěvky se štítkemIFRAME. Zobrazit všechny příspěvky
Zobrazují se příspěvky se štítkemIFRAME. Zobrazit všechny příspěvky

pátek 3. února 2012

How to notify parent page from a page running in iframe

Imagine you have PageA which has an iframe element.  Inside iframe PageB is hosted. Page B somewhere in it's lifecycle wants to notify PageA. What are the possibilities?
  1. use window.parent.__dopostback() javascript call which causes a postback in PageA. This works only in situation where PageA and PageB are running on same domain. When PageB is a completely different application under different domain parent is not accessible due to security reasons.
  2. use html5 messaging capabilities. HTML5 offers a postMessage method using which PageB can send a message to it's parent element. PageA can register for receiving specific events. This works under different domains too. Details are in the example below.
PageB:
<script type="text/javascript">
    window.parent.postMessage('par1', '*');
</script>

First argument to postMessage is the message that you are sending, second is the target origin which could be used in Page A to filter messages = Page A registers for receiving messages, and anyone can send a message to it. Target origin is a parameter on which the client and the receiver can agree and the receiver can filtrate  the incoming meesages based on it. '*' sign means you are accepting messages from everyone.

PageA:
<script type="text/javascript">
   function receiver(e) {
      alert(e.origin);
      alert(e.data);
   }
   if (!window.addEventListener) {
      window.attachEvent('onmessage', receiver);
   } else {
      window.addEventListener('message', receiver, false);  
   }               
</script>

addEventListener registers an event handler for receiving messages, when a message is received the receiver function is called where you have the origin and data available to work with. In the example there is also an attachEvent call, this is because of IE8 which goes on it's own way and doesn't support addEventListener. Instead of it it uses the attachEvent call. Code first checks whether addEventListener is available if not it registers the event using attachEvent. 

I did tests in IE, Firefox and Chrome, it worked great.

Links:
http://dev.w3.org/html5/postmsg/
http://rubayathasan.com/tutorial/ie8-addeventlistener-alternative-example/  

sobota 7. ledna 2012

P3P - cookies in iframe

On the level of browser you can control how the browser handles cookies registered by the application. You can turn off cookies completely (if that's your case than stop reading :) or can turn off cookies only in some specific case. The default setting can be different in different browsers, but in most of the cases browsers allow working with cookies.
In one of my integration projects where I was integrating our asp.net web application to one of our partner's application I encountered a problem with cookies denial in internet explorer.

Our application is hosted inside an iframe and after successfull login it issues an authentication cookie (forms authentication). Cookie is registered and works fine in firefox and chrome, but IE doesn't register the cookie and the flow of pages ends on the default redirect page (loginpage) after requesting some protected page from the application.

I rarely work with iframe, so it was new to me. After searching the net I've found out, that IE's default privacy setting is Medium, which doesn't allow the acceptance of third party cookies without compact privacy policy.



Ok, I understand that our application running in an iframe under different domain than the hosting application is considered as third party, but what is compact privacy policy and how can i set it up?

Well, privacy policy is some "proclamation" of the web site creator, how he will handle the data that the user enters on the site... It is even standardised and can be in an xml document which you link to your pages or can be as a compact privacy policy (shorter) added to http header of your site. On the web there are generators where you click in what you will do with the data and they give you the xml or the compact privacy policy.
If the browser receives this privacy policy it doesn't block your site in an iframe and accepts it's cookies as well.

In ASP.NET you can add a p3p policy using:
HttpContext.Current.Response.AddHeader ("p3p","CP=\"IDC DSP COR
ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT\"");
If the browser receives this privacy policy it doesn't block your site in an iframe and accepts it's cookies as well.
I think this header needs to be on every page of your site, in my case the login was done by a http handler where I didn't know where to add this header (in process_request it was too late)
So I decided to put it to the http header directly in the IIS, this way every resource served by IIS will have this header which is acceptable for me.
After restarting IIS the application started to work in IE as well as in other browser.

Please note that this post is not giving the world something new, it is more a reminder or knowledge base article to me and I hope that it can help somebody else dealing with the same problem too.

Links which I've found useful:
http://aspnetresources.com/blog/frames_webforms_and_rejected_cookies