Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Use an iFrame without session or cookie data (incognito)

If you use an iFrame element in an HTML document, the child page will load with all of the session and cookie data from the browser.

For example:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Stack Overflow in an iFrame</title>
  </head>
  <body>
    <h1>Stack Overflow in an iFrame</h1>
    <iframe src="http://stackoverflow.com" width="640" height="480" />
  </body>
</html>

Ignore for a moment that SO doesn't actually allow itself to be loaded in an iFrame. If it did, the SO page loaded by the iFrame would show you as signed in.

How can I use an iFrame without any cookies or session data? (like incognito mode in Chrome)

Why?

My company sells a product (web-app) for people to build customized websites with. When they are authenticated, and they visit their website, we show them the auth'ed version of the UI so that they can edit the content. Un-auth'ed users only see the static website. Using multiple browsers or clearing cookies is not a reasonable expectation of our users so we want to show a preview of their site to them in an iFrame so they can see what their visitors would see. We also want to show "mobile" previews of the site with smaller resolution iFrames so that they may see what their visitors would see if they came to the website on a phone. These iFrame(s) need to be loaded without access to the browser's cookies or session data so that they load in un-auth'ed mode, just like Chrome does in incognito mode.

I haven't tried anything yet because I don't know where to start. I did find out that HTML5 added some sandbox attribute values to the iFrame element, but none of them seem to help with this problem. Maybe something could be done with JavaScript, we do already use jQuery in our project.

Note: We aim to only use valid HTML5

like image 315
Jesse Webb Avatar asked Sep 05 '13 16:09

Jesse Webb


1 Answers

If you fully control the webstack wouldn't it be easier to add a preview parameter that treats the user as unauthenticated?

For instance:

<iframe src="http://stackoverflow.com?preview=1" width="640" height="480" />

Followed by bypassing your authorization checks if the preview flag exists.

like image 149
Guvante Avatar answered Sep 22 '22 21:09

Guvante