Web SDK

The Web SDK APIs are split into two main categories: Express and Low-Level. We recommend that you start with the Express API as this:

1. Simplifies integration
2. Automatically recovers from stream failures
3. Handles edge cases such as network reconnects

Our Express APIs provide a simple, single-step API for the easiest integration of streaming into your application. Common use cases include:

• Channel (one to many) -> Channel
• Group Broadcast (few to many) -> Room
• Group Chat (many to many) -> Room
• One to One Chat -> Room

If you find that the Express API doesn't work for you, take a look at our Lower Level API.

Please refer to npmjs.org for the latest available version.

The Web SDK is available on GitHub and can be installed as a pre-built universal module using several dependency management tools. The Web SDK may be included directly in the browser or bundled using your favorite bundling tool such as Webpack or Rollup. For a full list of browser support see Browser Support

Yarn

yarn add phenix-web-sdk

NPM

npm install -S phenix-web-sdk

Bower

bower install -S phenix-web-sdk

The universal module is available uncompressed and minified.

phenix-web-sdk.js

phenix-web-sdk.min.js

For support with React Native use the following bundles. For more information about integrating in your React Native app, see Initializing with React Native.

phenix-web-sdk-react-native.js

phenix-web-sdk-react-native.min.js

Use your favorite bundling tool such as Webpack or Rollup.

ES6 Modules

1import * as sdk from 'phenix-web-sdk';
2// Or Import just what you need
3import { express, utils, net } from 'phenix-web-sdk';

Common JS

1const sdk = require('phenix-web-sdk');

AMD

1define(['phenix-web-sdk'], function (sdk) {
2  // use sdk
3});

Load it directly in the browser in a script tag.

1var sdk = window['phenix-web-sdk'];

If you are using ember.js for your frontend, then you can add the Web SDK by generating a vendor shim:

ember generate vendor-shim phenix-web-sdk

Then modify ember-cli-build.js as shown:

Add the following imports in your ember-cli-build.js:

1app.import({
2  development: 'bower_components/phenix-web-sdk/dist/phenix-web-sdk.js',
3  production: 'bower_components/phenix-web-sdk/dist/phenix-web-sdk.min.js',
4});
5app.import('vendor/shims/phenix-web-sdk.js');

After that you can use the Web SDK in your code:

1import sdk from 'phenix-web-sdk';
2// use sdk

We recommend that you include the minified version of the web-sdk in your production app or bundle(s). We optimize this bundle for size using smart transformations.

Alias with webpack

You can alias phenix-web-sdk in your webpack production config to use the minified version.

1{
2    resolve: {
3        alias: {
4            'phenix-web-sdk': path.resolve(__dirname, '../node_modules', 'phenix-web-sdk/dist/phenix-web-sdk.min.js'),
5        }
6    }
7}

Observe value changes. Similar to the RxJS Behavior Subject

[object Observable]

Receive a notification every time the observable value changes.

1var subscription = observable.subscribe(function (newValue) {
2  // Do something with newValue
3}, options);
4
5setTimeout(function () {
6  // Stop listening to notifications after 1 second
7  subscription.dispose();
8}, 1000);

Parameters

Options

[object Subscription]

Value may be of any supported javascript type

1observable.getValue(value);

Change the observable value. This will trigger notifications on all subscribers.

1observable.setValue(value);