JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 626
  • Score
    100M100P100Q109892F

Convenient communication between the parent site and iframe based on window.postMessage()

Package Exports

  • iframe-phone

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (iframe-phone) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

iframe-phone

Simplified communication between the parent site and iframe based on window.postMessage()

Build

To install dependencies (browserify) run:

npm install

To build the library in dist directory run:

npm run build

Usage

iframe-phone is a UMD bundle (dist/iframe-phone.js). You can include it directly or use some module system (e.g. browserify or RequireJS). When you include it directly, it will be available under global iframePhone name.

parent

var phone = new iframePhone.ParentEndpoint(iframeElement, function () {
  console.log("connection with iframe established");
});
phone.post('testMessage', 'abc');
phone.addListener('response', function (content) {
  console.log("parent received response: " + content);
});

iframe

// IFrameEndpoint instance is a singleton (iframe can't have multiple parents anyway).
var phone = iframePhone.getIFrameEndpoint();
phone.addListener('testMessage', function (content) {
  console.log("iframe received message: " + content);
  phone.post('response', 'got it');
});
// Initialize connection after all message listeners are added!
phone.initialize();

Licensing

iframe-phone is Copyright 2012 (c) by the Concord Consortium and is distributed under MIT license.