zeroasterisk / react-iframe-resizer-super

inject HTML into an iframe, and/or resize an iframe to the height of it's contents
https://zeroasterisk.github.io/react-iframe-resizer-super
MIT License
50 stars 20 forks source link

Callbacks #14

Open phil-dileo opened 5 years ago

phil-dileo commented 5 years ago

Just wondering if any of the iframe-resizer callbacks work. I can't seem to get init, message, resized to work when passed in as iframeResizerOptions. I've also tried setting a React ref on the ReactIframeResizer component to inject the readyCallback and that's not working either. Any tips?

"react-iframe-resizer-super": "0.2.2",
"react": "16.6.3",
// Attempt to inject ready callback
  componentDidMount() {
    window.addEventListener('message', this.receiveMsg);
    // this.iframeRef.current. => console.log('ready callback .. ');
    debugger;
    if (this.iframeRef && this.iframeRef.current) {
      this.iframeRef.current.refs.frame.iFrameResizer = {
        readyCallback: () => console.log('ready callback .. '),
      };
    }
  }
...
    const opts = {
      checkOrigin: false,
      log: true,
      iframeResizerEnable: true,
      initCallback: (iframe) => console.log(iframe),
      readyCallback: (iframe) => console.log(iframe),
      resizedCallback: () => console.log('hello'),
      messageCallback: () => console.log('hello'),
      scrolling: true, // Payoda has min-height/widths so we'll need to scroll in some cases.
      warningTimeout: 0,
    };

    <Fragment>
        {this.state.isLoading &&
          <div className='floating-loader'>
            <LoadingIndicator large={true} loadingText={`Loading ${sectionAttrs.name}...`} />
          </div>
        }
        <ReactIframeResizer
          ref={this.iframeRef}
          id={sectionAttrs.id}
          src={src}
          iframeResizerOptions={opts}
          style={{
            height: '100%',
            width: '100%',
          }}
        />
      </Fragment>

If I enable logging I can see messages in the console, but that's about it.

phil-dileo commented 5 years ago

Note that it's not the same domain.

phil-dileo commented 5 years ago

Looks like these work when the parent and iframe are in the same domain. I thought this would work with different domains given checkOrigin: false?

dagadbm commented 5 years ago

did you end up solving this? i also have this problem