0

We're developing a Javascript SDK which is used by embedded applications (injected in my site as IFRAMEs) to help them use some resources like loading some dialogs: e.g. an authorization dialog or a share box(like Facebook).

Our SDK is using easyXDM to work more or less like this:

HTML Page
----------------------------------------------------------------------------------------------------------------------------
| http / https: www.mysite.com/embedded-app/
| (Some JS classes)
|
|- - - - - | ------------------------------------------------------------------------------------------------------------------
|- - - - - | (IFRAME)
|- - - - - | https: // www.some-embedded-app-domain.com/page.html
|- - - - - | (loads and instantiates the SDK from "http/https:www.mysite.com/sdk.js that uses easyXDM)
|- - - - - |
|- - - - - | - - - - - |---------------------------------------------------------------------------------------------------
|- - - - - | - - - - - | (IFRAME injected by easyXDM)
|- - - - - | - - - - - | http / https: www.mysite.com/embedded_provider.html
|- - - - - | - - - - - | (Communication with window.top to talk to use those wndow.top JS classes)
|- - - - - | - - - - - |
|- - - - - | - - - - - |
|- - - - - | - - - - - |
|- - - - - | - - - - - |

My site can be loaded both using http/https, but the embedded application must be served using always HTTPS. In order to allow the inner iframe injected by easyXDM to communicate with my site, the host and protocol must match in both urls, otherwise a same origin policy violation will arise.

Problem: how would I tell the code from the SDK, which is loaded from an external app URL, that the outer windows (my site) is using http or https, to render the embedded_provider.html using the same protocol and thus allowing JS communication between both of them?

The only solution I can think of is to inform the embedded app somehow that we're currently browsing from http / https, and then it can instantiate it properly (using a flag use_https or so), but I'd prefer to not force the App to know the protocol we are using.

Do you know any other alternative?

Thanks!

juanjocv
  • 144
  • 1
  • 7

2 Answers2

1

The only solution I can think of (haven't tested this though), is to have easyXDM put in 2 test iframes - one on http://www.mysite.com/url_test and one on https://www.mysite.com/url_test.

Then have your /url_test webpage try to access window.top.location.href. If /url_test can see the location, then it must be on the same domain. Then the successfull /url_test page will communicate to the parent iframe (on some-embedded-app.com) via easyXDM to create the iframe you really want on the correct host.

Note: the /url_test page which is on the incorrect host will start to dump same-origin iframe warnings in the console. :)

Note #2: if this approach works, you could iteratively improve it by saying, "because of the product domain, i know that 80% of these embeds will be on http. I'll make a /url_test on http first, then try https as a backup."

tommyh
  • 121
  • 1
  • 4
0

Use // instead http:// or https://

The browser will sort it out

mplungjan
  • 169,008
  • 28
  • 173
  • 236
  • Sadly, this doesn't work, since the 1st IFRAME is loaded always on HTTPS (and thus the "//" will be always resolved as https), but the outer most window may be on HTTP. – juanjocv Mar 12 '13 at 11:11