https://github.com/arnellebalane/hermes
Client-side messaging channel for sending data from one browser tab to another
https://github.com/arnellebalane/hermes
broadcast-channel client-side hacktoberfest localstorage npm-package shared-worker
Last synced: 3 months ago
JSON representation
Client-side messaging channel for sending data from one browser tab to another
- Host: GitHub
- URL: https://github.com/arnellebalane/hermes
- Owner: arnellebalane
- License: mit
- Created: 2017-05-09T10:48:52.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2021-11-14T08:00:53.000Z (over 3 years ago)
- Last Synced: 2024-04-14T07:46:14.265Z (about 1 year ago)
- Topics: broadcast-channel, client-side, hacktoberfest, localstorage, npm-package, shared-worker
- Language: JavaScript
- Homepage: https://hermes.arnelle.dev
- Size: 102 KB
- Stars: 129
- Watchers: 7
- Forks: 29
- Open Issues: 2
-
Metadata Files:
- Readme: readme.md
- License: license
Awesome Lists containing this project
README
# Hermes
Client-side messaging channel for sending data from one browser tab to another with the same origin. Think of it as a PubSub module that can send messages across multiple browser tabs.
To see a demo of Hermes in action, open [this page](https://hermes.arnelle.me/) in multiple browser tabs.
## Usage
Get a copy of `hermes.js` or `dist/hermes.min.js` and include it in your code:
```html
```
Hermes also supports AMD, so it can also be included this way:
```js
require(['path/to/hermes'], function(hermes) { });
```
Hermes exposes an object named `hermes` which contains the API methods.
## API
- **`send(topic, data, [includeSelf=false])`**: Send data to other browser tabs subscribed to a specified topic.
- `topic`: The name of the topic in which the data will be sent to.
- `data`: The data to be sent. This needs to be a JSON-serializable object.
- `includeSelf` (optional, default=false): A boolean indicating whether the data should also be sent to the current tab.
```js
hermes.send('some-topic', 'hello world');
hermes.send('some-topic', { title: 'awesome' });
hermes.send('some-topic', { title: 'awesome' }, true);
```
- **`on(topic, callback)`**: Add a callback function for a specified topic.
- `topic`: The name of the topic to subscribe to.
- `callback`: The callback function, which accepts a single argument representing the data that was sent originally.
```js
hermes.on('some-topic', function(data) { });
```
- **`off(topic, [callback])`**: Remove a callback function for a specified topic.
- `topic`: The name of the topic to unsubscribe from.
- `callback` (optional): The callback function to remove, or don't provide in order to remove all callback functions for the `topic` topic.
```js
hermes.off('some-topic', callbackFunction);
hermes.off('some-topic');
```
## License
MIT License