SIP Javascript SDK

Use the Speechpath Javascript SDK to integrate live phone traffic data into your web app. This plugin uses PubNub publish/subscription network as the underlying transport, so the Speechpath/PubNub integration must also be enabled on your account.

Server Side Connection

For server-side integration, use one of PubNub’s many SDKs with the subscription key from the Speechpath/Pubnub integration. Call event data is published as JSON objects to PubNub on these channels:

presence
activeCalls.{number}
activeCalls.all
stats

In The Browser

To connect using the javascript SDK in the browser:

Download the SDK here

or include the script in the head of the page:

<script type="text/javascript" src="https://speechpath.app/js/plugins/sdk.js"></script>

SDK Configuration

App id, token and pbx code are available under the settings page in the speechpath.app web portal.

Configuration object parameters:

Parameter	Type	Description	Values	Required
id	Integer	Speechpath App ID		required
token	String	Speechpath App Token		required
pbx_code	String	PBX extension code
number	String	This number will be used as a filter for call information. If the number is an extension, the pbx_code parameter should also be supplied.
channels	Array	Array of channels to subscribe.	presence activeCalls stats	required

Events

The SDK accepts callbacks for these events:

Event	Syntax
activeCalls	`speechpath.onActiveCalls(callback) //or speechpath.on('activeCalls', callback)`
presence	`speechpath.onPresence(callback) //or speechpath.on('presence', callback)`
stats	`speechpath.onStats(callback) //or speechpath.on('stats', callback)`
error	`speechpath.onError(callback) //or speechpath.on('error', callback)`	The callback will usually receive a Javascript Error object. If no callback is defined console.error will be used.

More detail on the received objects can be found on the JSON objects page.

Example

The following example code will subscribe to the live call data stream, writing the objects to the html.
Be sure to substitute the id and token in the config object with your own credentials from the settings menu.


<!DOCTYPE html>
<html>
    <head>
        <title>Speechpath SIP data</title>
        <meta charset="UTF-8">
        <script src="https://speechpath.app/js/plugins/sdk.js"></script>
        <style>
            .wrapper{width:1000px; margin:10vh auto;}
            .output {
                padding:10px; margin:5px; background-color:#555; overflow: hidden;
                color:#fff; width:300px; height: 400px; display:inline-block
             }
        </style>
    </head>
    <body>
         <div class="wrapper">
            <div class="output" id="activeCalls"></div>
            <div class="output" id="stats"></div>
            <div class="output" id="presence"></div>
        </div>
        
        <script>
            var myApp = {
                handle: function (data, channel) {                    
                    document.getElementById(channel)
                        .innerHTML = `<pre>${JSON.stringify(data, null, 2)}</pre>`;
                }
            };
        
            // These values should be substituted with your own credentials.
            var config = {
                id: 303,
                token: '42DAHhgtTGslaTFatfFKiobE6CynU3ee'
                services: ['presence','activeCalls', 'stats']
            };

            window.addEventListener('load', function(){
                const sip2web = new Speechpath(config);
                sip2web.on('activeCalls', myApp.handle); 
                sip2web.on('stats', myApp.handle); 
                sip2web.on('presence', myApp.handle); 
            });

        </script>       
    </body>
</html>