https://github.com/sorenlouv/frametalk
Simple postMessage wrapper to make cross-frame communication easy as pie. Supports promises and return values. (No dependencies)
https://github.com/sorenlouv/frametalk
browser communication iframe postmessage promise
Last synced: about 2 months ago
JSON representation
Simple postMessage wrapper to make cross-frame communication easy as pie. Supports promises and return values. (No dependencies)
- Host: GitHub
- URL: https://github.com/sorenlouv/frametalk
- Owner: sorenlouv
- Created: 2017-03-15T20:49:15.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2022-12-09T08:14:59.000Z (over 2 years ago)
- Last Synced: 2025-04-05T09:03:15.803Z (2 months ago)
- Topics: browser, communication, iframe, postmessage, promise
- Language: JavaScript
- Homepage:
- Size: 247 KB
- Stars: 11
- Watchers: 2
- Forks: 4
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Install
```
$ npm install --save frametalk
```
## One way usage
Send a message to another frame.
```js
const frametalk = require('frametalk');
// Frame A: send a message to frame B
frametalk.send(frameB, 'hello', {foo: 'bar'});
// Frame B: receive message from frame A
frametalk.on('hello', (event, data) => {
console.log(data); // output: {foo: 'bar'}
});
```
## Two way usage
Send a message to another frame and get a response back
```js
const frametalk = require('frametalk');
// Frame A: send request to frame B, and await reply
frametalk.request(frameB, 'getStatus')
.then((res) => {
console.log(res); // output: {status: 'OK'}
});
// Frame B: receive message from frame A, and send reply back
frametalk.replyOn('getStatus', (event) => {
return {status: 'OK'};
});
```
You can also respond with a promise:
```js
frametalk.replyOn('getStatus', (event) => {
return new Promise((resolve) => {
setTimeout(() => {
resolve({status: 'Still OK'});
}, 1000);
})
});
```