Jacob J
Jacob J

Reputation: 301

How to use iFrameResizer on multiple domains?

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>

Upvotes: 5

Views: 6302

Answers (2)

David Bradshaw
David Bradshaw

Reputation: 13097

Your call should be as follows.

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

Upvotes: 9

nikos.svnk
nikos.svnk

Reputation: 1375

maybe try validating origin

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

Upvotes: 3

Related Questions