• Skip to Search
  • Skip to Content
  • Skip to Side Navigation
Getting StartedSDK ReferenceGlossary
  • Home
  • Getting Started
  • SDK Reference
  • Portal
  • How-To
  • Troubleshooting
  • FAQs
  • Reference
  • Glossary
REST API
Web SDK
Android SDK
iOS SDK
Unity SDK
React Native SDK
EdgeAuth SDK
  • Overview
  • Web SDK 1.0
    • Overview
    • Express API
    • Low-Level API
  • Web SDK 2.0
    • Overview
    • Channel
  • Browser Support
  • Web Examples
  • Release Notes

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.

Latest Release

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

Bundling in your app

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

Bundles

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

Including with a bundler

Use your favorite bundling tool such as Webpack or Rollup.

ES6 Modules

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

Common JS

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

AMD

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

Loading Directly in the Browser

Load it directly in the browser in a script tag.

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

Initializing With Ember.js

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:

JavaScript
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:

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

Production

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.

JavaScript
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}

Observable

Observe value changes. Similar to the RxJS Behavior Subject

[object Observable]

NameSignatureReturnsDescription
subscribe(callback, options)[object Subscription]See Subscribe to an Observable
getValue()anySee Get Observable Value
setValue(value)voidSee Set Observable Value

Subscribe to an Observable

Receive a notification every time the observable value changes.

JavaScript
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

NameTypeDescription
callback (required)FunctionFunction to call when value changes
options (optional)ObjectOptions for subscription.

Options

NameTypeDefault ValueDescription
initial (optional)StringWhat to do when the subscription starts. Pass in 'notify' to be notified of initial value

[object Subscription]

NameSignatureReturnsDescription
dispose()voidStop listening to notifications

Get Observable Value

Value may be of any supported javascript type

JavaScript
1observable.getValue(value);

Set Observable Value

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

JavaScript
1observable.setValue(value);
Page Content
    Copyright 2023 © Phenix RTS
    Privacy Policy | Terms of Service
    v2023-01-31T21:25:10