Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/motiz88/postmessage-json-rpc
JSON-RPC over window.postMessage, with a Promise-based API.
https://github.com/motiz88/postmessage-json-rpc
Last synced: 19 days ago
JSON representation
JSON-RPC over window.postMessage, with a Promise-based API.
- Host: GitHub
- URL: https://github.com/motiz88/postmessage-json-rpc
- Owner: motiz88
- Created: 2015-07-09T17:41:05.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-05-25T11:22:01.000Z (over 7 years ago)
- Last Synced: 2024-10-13T02:22:02.508Z (about 1 month ago)
- Language: JavaScript
- Homepage:
- Size: 428 KB
- Stars: 7
- Watchers: 3
- Forks: 3
- Open Issues: 174
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## postmessage-json-rpc [](https://travis-ci.org/motiz88/postmessage-json-rpc) [](https://coveralls.io/github/motiz88/postmessage-json-rpc?branch=master)
JSON-RPC over `window.postMessage`, with a Promise-based API.
This package provides a server and client written in JavaScript that can communicate with each other across browser windows or `iframe`s using a subset of JSON-RPC 2.0.
## Code Example
### ES2015
```javascript
import {Client, Server} from 'postmessage-json-rpc';
const client = new Client();
const server = new Server({
hello(who) {
return Promise.resolve(`Hello ${who}!`);
}
});
client.mount(window);
server.mount(window);
client.request('hello', window, 'world, of course')
.then(answer => console.log(answer));
// Hello world, of course!
```
### ES5
```javascript
var rpc = require('postmessage-json-rpc');
var client = new rpc.Client();
var server = new rpc.Server({
hello: function(who) {
return Promise.resolve('Hello ' + who + '!');
}
});
client.mount(window);
server.mount(window);
client.request('hello', window, 'world, of course').then(function (answer) {
return console.log(answer);
});
// Hello world, of course!
```
## Motivation
I had a need to quickly "componentize" a legacy web app from an older project, so I could run it in an `iframe` in a new project and invoke bits of its internal API. I implemented a basic RPC server (for the legacy app) and client (for the host app) using `window.postMessage`/`window.onmessage` as the communication channel and (at the moment, loosely) JSON-RPC 2.0 as the message format, and that became the basis of `postmessage-json-rpc`.
There were already some libraries that did something like this, but I really wanted a fully Promise-based async API on both the client and server side. So I coded one myself :smile:
## Status/Caveats
The JSON-RPC 2.0 implementation here is not complete, in that batch requests (at least) are not implemented, and there may be some other subtle discrepancies at the moment. Still, for what it does, the module is quite usable.
## Installation
```sh
npm install --save postmessage-json-rpc
```
Use Browserify / Webpack to include this module in your front-end code.
## API Reference
[Basic documentation is available on GitHub.](https://motiz88.github.io/postmessage-json-rpc/doc/)
## Tests
Clone this repo, and then run:
```sh
npm install
karma start --single-run
```
## Contributors
I welcome and greatly appreciate bug reports, feature ideas, and pull requests in all areas.
## License
MIT