Iframe communications using json rpc
MIT License
Iframe/Window communications using post messages is such a pain in the arse
This reimagines Iframe communication using JSON RPC. What if you can just call a function to do something in your iframe without thinking in terms of postmessages and get something back without thinking about listening for messages?
Play with sandbox here
import { createBackend } from '@ameerthehacker/frame-rpc';
createBackend({
add: (num1, num2) => {
return num1 + num2;
},
});
import { FrameRPC } from '@ameerthehacker/frame-rpc';
const iframeElement = document.getElementById('iframe-element');
const iframeRPC = new FrameRPC(iframeElement.contentWindow);
await iframeRPC.handshake();
const frontend = iframeRPC.createFrontend();
const result = await frontend.add(2, 5);
// will print 7 😃
console.log(result);
You can have strong contracts using typescript generic and you can refer to the code in playground for samples.
yarn
yarn start
MIT © Ameer Jhan