
Security News
PyPI Now Supports iOS and Android Wheels for Mobile Python Development
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
Cross-tab message bus for browsers.
Awesome things to do with this library:
- Send messages between browser tabs and windows.
- Share single websocket connection when multiple tabs open (save server resources).
- Shared locks (run live sound notification only in single tab on server event).
Supported browser:
Known issues:
localStorage
write.localStorage
events between tabs.node.js (for use with browserify
):
$ npm install tabex
bower:
$ bower install tabex
In 99% of use cases your tabs are on the same domain. Then tabex
use is very
simple:
// Do it in every browser tab, and clients become magically connected
// to common broadcast bus :)
var live = window.tabex.client();
live.on('channel.name', function handler(message) {
// Do something
});
// Broadcast message to subscribed clients in all tabs, except self.
live.emit('channel.name2', message);
// Broadcast message to subscribed clients in all tabs, including self.
live.emit('channel.name2', message, true);
Fabric to create messaging interface. For single domain you don't need any options, and everything will be initialized automatically. For cross-domain communication you will have to create html file with router for iframe, loaded from shared domain.
Options:
tabex
instances in parallel.Subscribe to channel. Chainable.
function (data, channel) { ... }
.Unsubscribe handler from channel. Chainable. If handler not specified - unsubscribe all handlers from given channel.
Send message to all tabs in specified channel. By default messages are
broadcasted to all clients except current one. To include existing client -
set toSelf
to true
.
Note. Getting lock takes 30ms when localStorage used as events transport.
Add transformers for incoming (handled) and outgoing (emitted) messages.
Chainable. This is a very powerful feature, allowing tabex
customization. You
can morph data as you wish when it pass client pipeline from one end to another.
Filter message structure:
<node_id>_<msg_counter>
. Consists or unique
client instance id (random) and message ccounter (inremented for each
new message)client.emit()
.Use case examples:
faye
does not allow .
in channel names. You can add filters
for transparent replace of .
with !!
.Direct access to router is needed only for cross-domain communication (with
iframe). For single domain tabex
client will create local router automatically.
Fabric to create router in iframe. Options:
tabex.client
.Example.
In your code:
var live = window.tabex.client({
iframe: 'https://shared.yourdomain.com/tabex_iframe.html'
});
In iframe:
window.tabex.router({
origin: [
'http://yourdomain.com',
'https://yourdomain.com',
'http://forum.yourdomain.com',
'https://forum.yourdomain.com'
]
});
Warning! Never set *
to allowed origins value. That's not secure.
Channels !sys.*
are reserved for internal needs and extensions. Also tabex
already has built-in events, emitted on some state changes:
channels
- array of all channels subscribed in all tabstabex.client
to notify router about new
subscribed channel. Message data:
channel
- channel nametabex.client
to notify router that all
subscriptions to channel gone. Message data:
channel
- channel nametabex.client
to try acquire lock. Message data:
tabex.client
to release already acquired
lock. Message data:
node_id
- id of "local" router nodemaster_id
- id of node that become masterNote. !sys.master
event is broadcasted only when localStorage
router
used. You should NOT rely on it in your general application logic. Use locks
instead to filter single handler on broadcasts.
Example below shows how to extend tabex
to share single faye
connection
between all open tab. We will create faye
instances it all tabs, but activate
only one in "master" tab.
User can close tab with active server connection. When this happens, new master will be elected and new faye instance will be activated.
We also do "transparent" subscribe to faye channels when user subscribes with tabex client. Since user can wish to do local broadcasts too, strict separation required for "local" and "remote". We do it with addind "remote.*" prefix for channels which require server subscribtions.
Note. If you don't need cross-domain features - drop iframe-related options and code.
In iframe:
window.tabex.router({
origin: [ '*://*.yourdomain.com', '*://yourdomain.com' ]
});
In client:
// This one is for your application.
//
var live = window.tabex({
iframe: 'https://shared.yourdomain.com/tabex_iframe.html'
});
// Faye will work via separate interface. Second interface instance will
// reuse the same router automatically. Always use separate interface for
// different bus build blocks to properly track message sources in filters.
//
// Note, you can attach faye in iframe, but it's more convenient to keep
// iframe source simple. `tabex` is isomorphic, and faye code location does
// not make sense.
//
var flive = window.tabex({
iframe: 'https://shared.yourdomain.com/tabex_iframe.html'
});
var fayeClient = null;
var trackedChannels = {};
// Connect to messaging server when become master and
// kill connection if master changed
//
flive.on('!sys.master', function (data) {
// If new master is in our tab - connect
if (data.node_id === data.master_id) {
if (!fayeClient) {
fayeClient = new window.faye.Client('/faye-server');
}
return;
}
// If new master is in another tab - make sure to destroy zombie connection.
if (fayeClient) {
fayeClient.disconnect();
fayeClient = null;
trackedChannels = {};
}
});
// If list of active channels changed - subscribe to new channels and
// remove outdated ones.
//
flive.on('!sys.channels.refresh', function (data) {
if (!fayeClient) {
return;
}
// Filter channels by prefix `local.` and system channels (starts with `!sys.`)
var channels = data.channels.filter(function (channel) {
return channel.indexOf('local.') !== 0 && channel.indexOf('!sys.') !== 0;
});
// Unsubscribe removed channels
//
Object.keys(trackedChannels).forEach(function (channel) {
if (data.channels.indexOf(channel) === -1) {
trackedChannels[channel].cancel();
delete trackedChannels[channel];
}
});
// Subscribe to new channels
//
data.channels.forEach(function (channel) {
if (!trackedChannels.hasOwnProperty(channel)) {
trackedChannels[channel] = fayeClient.subscribe('/' + channel.replace(/\./g, '!!'), function (message) {
flive.emit(channel, message.data);
});
}
});
});
// Resend events without prefix `local.` and prefix `!sys` to server, convert channel
// names to faye-compatible format: add '/' at start of channel name and replace '.' with '!!'
//
flive.filterIn(function (channel, message, callback) {
if (fayeClient && channel.indexOf('local.') !== 0 && channel.indexOf('!sys.') !== 0) {
fayeClient.publish('/' + channel.replace(/\./g, '!!'), message);
return;
}
callback(channel, message);
});
// Convert channel name back from faye compatible format: remove '/'
// at start of channel name and replace '!!' with '.'
//
flive.filterOut(function (channel, message, callback) {
if (channel[0] === '/') {
callback(channel.slice(1).replace(/!!/g, '.'), message);
return;
}
callback(channel, message);
});
FAQs
Cross-tab message bus for browsers.
The npm package tabex receives a total of 694 weekly downloads. As such, tabex popularity was classified as not popular.
We found that tabex demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
Security News
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.