4.1.3 • Published 2 years ago
@packaged-ui/frame-courier v4.1.3
FrameCourier
High level interface to window.postMessage. This package makes it easy to send and receive secure messages cross-origin.
Launching Demo
- Compile the distribution (
yarn install && yarn build
) - Serve the demo. The simplest way (if you have php enabled) is to use the php built-in webserver
php -s localhost:8111 -t .
- Open the browser http://localhost:8111/demo/
Basic Usage
Frames
FrameCourier requires frames to be named. This name will be used as the target of communication of FrameCourier.sendMessage
<body>
<iframe courier-name="myframe" src="/myframe.html"></iframe>
</body>
Listeners
FrameCourier.listen(
'my event',
function(payload) { alert(payload); }
);
Sending Messages
FrameCourier.send(
'myframe', // target frame name
'my event', // event (listener)
'my message' // payload
);
Advanced Usage
Bidirectional communication
Use built in response callbacks to send messages back to the originating frame.
FrameCourier.listen(
'my event',
function(payload, respond) { alert(payload); respond('response payload'); }
);
FrameCourier.send(
'myframe', // target frame name
'my event', // action (listener)
'my message', // payload
function(responsePayload) { alert('got response: ' + responsePayload); }
);
Implementation
- Use
/dist/frame-courier.min.js
to haveFrameCourier
assigned as a global variable. - Import
/src/index.js
into your script to assign to your own internal variable.
4.1.3
2 years ago
4.1.2
3 years ago
4.1.1
3 years ago
4.1.0
3 years ago
4.0.7
3 years ago
4.0.5
3 years ago
4.0.6
3 years ago
4.0.4
3 years ago
4.0.3
3 years ago
4.0.1
3 years ago
4.0.2
3 years ago
4.0.0
3 years ago
3.1.3
4 years ago
3.1.2
4 years ago
3.1.1
4 years ago
3.1.0
4 years ago
3.0.0
4 years ago
2.0.1
4 years ago
2.0.0
4 years ago
1.1.5
5 years ago
1.1.4
5 years ago
1.1.3
5 years ago
1.1.2
5 years ago
1.1.1
5 years ago
1.1.0
5 years ago
1.0.0
5 years ago
0.1.0
5 years ago