How to use iFrameResizer on multiple domains?

Question

i'm using Iframe Resizer and my code is not working cross domain. It works fine when the two domain are the same. Can you help? It's weird because the iframe definitely has the iFrameResizer.contentWindow.js loaded AND i use the checkOrigin: false so it should allow the cross domain...

Here are the errors I get in the console when loading the parent page that has the iframe:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('http://jacobjohnson.net') does not match the recipient window's origin ('http://designtesting.cfs.local').

iframeResizer.min.js:8 [iFrameSizer][Host page: display_frame] No response from iFrame. Check iFrameResizer.contentWindow.js has been loaded in iFrame

<div class="panel panel-default" id="iframePanel">
    <div class="panel-body" style="padding:0px;">
       <iframe id="display_frame" name="display_frame" class="frame" src="http://jacobjohnson.net/iframetest.html" allowfullscreen></iframe>
    </div>
</div>


<script>

    jQuery('#display_frame').iFrameResize( [{log:true, checkOrigin: false}] );

    var frameHeight =  3905; // $('#display_frame').height();
    var newHeight = frameHeight / 2;
    $('#iframePanel').height(newHeight);

    $(window).resize( function() {
        var frameHeight = $('#display_frame').height();
        var newHeight = frameHeight / 2;
        $('#iframePanel').height(newHeight);
    });

</script>

https://stackoverflow.com/questions/153152/resizing-an-iframe-based-on-content?rq=1 — nikos.svnk, Mar 20 '17 at 19:47
@nikos.svnk, i'm not sure I understand. That example is using 3 pages when I only have 2.. — Jacob J, Mar 20 '17 at 19:55

score 8 · Answer 1 · answered Apr 13 '17 at 13:25

8

Your call should be as follows.

jQuery('#display_frame').iFrameResize({log:true, checkOrigin: false});

answered Apr 13 '17 at 13:25

David Bradshaw

11,859
3
41
70

1

I ended up using the native javascript call to get it to work. var iframes = iFrameResize( [{options}], [css selector] || [iframe] ); – Jacob J Apr 13 '17 at 14:07

score 3 · Answer 2 · answered Mar 20 '17 at 20:27

3

maybe try validating origin

var domains = ['http://jacobjohnson.net','http://designtesting.cfs.local'];
jQuery('#display_frame').iFrameResize( [{log:true, checkOrigin: domains}] );

answered Mar 20 '17 at 20:27

nikos.svnk

1,375
1
13
24

Still not working. I also have log:true, but i'm not getting any sort of logging working.. – Jacob J Mar 21 '17 at 20:41
and you are still getting the same error? which is about the "same origin" ? – nikos.svnk Mar 21 '17 at 22:14
This worked for me, though it depends on both servers Apache/nginx directives allowing cross domain scripting. They have hardened rules for cross-origin resource sharing (CORS): More info: enable-cors.org/server_apache.html – Braconnot_P Feb 16 '19 at 00:34

How to use iFrameResizer on multiple domains?

2 Answers2