@besync/react-use-iframe

This is a light-weight React Hook for inserting an iFrame into a React element.

Usage no npm install needed!

<script type="module">
  import besyncReactUseIframe from 'https://cdn.skypack.dev/@besync/react-use-iframe';
</script>

README

React Hook for embedded Cross-Domain IFrames and Web Workers with 2 Way RPC Communication Channel

About

This is a light-weight React Hook for inserting an iFrame into a React element.

It solves the issues associated with passing objects, events and function calls between parent and child, especially in Cross Domain situations. This allows expensive work and/or security-sensitive work to be offloaded to sandboxed child iframes.

Optionally includes a zero-configuration, batteries included, runner for Webpack that automatically creates separate host and child entry points and HTML pages.

Features

  • Written for modern (2019+) React
  • Custom positioning anywhere in your host React component with {iframe}
  • iframe may contain any content including React components, third party widgets, etc.
  • Automatic resizing of parent