3

Suppose that we have two pages: A.html and B.html. They don't have the same origin (same domain, port or something), but I can edit both of them.

I want to embed B.html into A.html using iframe. The elements from B.html are changed using the passed data to page (using jQuery).

I want to send a very long string from A to B. My first try was using url search parameters:

<iframe src=".../B.html?param=a_very_very_long_encoded_string#some-hash"></iframe>

The application works good only on the local machine, but on web I get 414 Request-URI Too Large error.

I have no idea how this can be done only using client side.

Is there any alternative or do I must to use server side with POST method?

Ionică Bizău
  • 109,027
  • 88
  • 289
  • 474
  • Look at using localStorage - that will suit you needs, as long as both pages are on the same domain. – Reinstate Monica Cellio Sep 10 '13 at 17:08
  • @Archer That's the problem! The two pages are not on the same domain... – Ionică Bizău Sep 10 '13 at 17:11
  • @Archer I don't see how local storage could help. If you can edit the php headers of B to allow cross domain request, then I would suggest using ajax – omma2289 Sep 10 '13 at 17:12
  • @koala_dev He hadn't stated whether it was cross-domain or not, which is why I said "as long as both pages are on the same domain". He added that info to the question *because* I asked. – Reinstate Monica Cellio Sep 10 '13 at 17:13
  • Building off @koala_dev -- You could create a load function that takes in the info needed to update the page. In the load callback, apply the data. – tymeJV Sep 10 '13 at 17:13
  • @Archer No, when I wrote the question I wrote that the pages *don't have the same origin*, but then I clarified. See the [first version](http://stackoverflow.com/revisions/18724950/1). – Ionică Bizău Sep 10 '13 at 17:14
  • Yep - my bad. I obviously missed that. – Reinstate Monica Cellio Sep 10 '13 at 17:16
  • @KevinB Looking to documentation it sounds good. I haven't worked with them yet, so it would be the first time. :-) Looking for an answer. – Ionică Bizău Sep 10 '13 at 17:18
  • I haven't used them before either, i've never needed them. It looks like it may be a valid solution, if it works, post that as an answer with a code sample. – Kevin B Sep 10 '13 at 17:19
  • @KevinB Hahaha, "IE: Not supported", but I don't care. :-) Please post an answer. It was your idea. – Ionică Bizău Sep 10 '13 at 17:21
  • Anything not involving the server/POST seems kind of hackish however if you must not use server-side processing but still have access to modify apache directives (assuming you are using apache) then I believe that you can increase the maximum accepted URI length with the [`LimitRequestLine`](http://httpd.apache.org/docs/2.0/mod/core.html#limitrequestline) flag. I had to look this up as I've not tested it myself - so if you find it useful you can always upvote [this post](http://stackoverflow.com/a/2761608/1238344) :) – Emissary Sep 10 '13 at 17:28
  • @Emissary No, no! The string that I want to send has length higher than `50000` characters, and my page is hosted on Github. :-) I voted the post. :-) – Ionică Bizău Sep 10 '13 at 17:36

1 Answers1

2

This looks like a good usecase for postmessages. Postmessages allow for cross-domain communication between a parent page and it's iframe or opened window (both ways). As for limits on the size of the message being sent, i think they're large enough to handle most things that you would want to send cross-domain from window to window. No limit is mentioned in the MDN.

As far as browser support. All modern browsers support it, however IE8 only supports it for iFrames, and IE7 doesn't support it at all. IE10 supports it but has limits, mentioned in the MDN.

Kevin B
  • 94,570
  • 16
  • 163
  • 180
  • Is IE really a browser? Thank you! Seems to be the correct answer. :-) – Ionică Bizău Sep 10 '13 at 17:39
  • sadly i still have to provide functional support for IE7, but it really isn't that bad. – Kevin B Sep 10 '13 at 17:40
  • No, I am a Linux user and I don't need IE support. :-) [Here](http://javascript.info/tutorial/cross-window-messaging-with-postmessage) is a nice tutorial. Thank you! It works as expected. – Ionică Bizău Sep 10 '13 at 17:46
  • 1
    for people stuck on legacy support, the `window.name` hack might be a place to turn to, here's [another question](http://stackoverflow.com/questions/10567847/window-name-as-a-data-transport-a-valid-approach) about it's pros and cons – Robert Byrne Sep 10 '13 at 17:55