3

I'm attempting to use the JsSIP library to build a softphone with LWC. I've created the CSP records for my websocket server, but I still can't connect for some reason.

Every time it attempts to connect I get the following error:

jssip-3.3.11.js:25371 WebSocket connection to 'wss://xxx.xxx.com:5050/' failed: WebSocket opening handshake timed out

Is there additional configuration I need to do in order to get WebSockets and LWC working together? Has anyone come across this error before in LWC?

Here is the code I have for the LWC component:

//================================================================================
// Libraries
//================================================================================
import { LightningElement } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { loadScript } from 'lightning/platformResourceLoader';
import JSSIP from '@salesforce/resourceUrl/jssip';

//================================================================================
// Private Properties
//================================================================================
const SIPEvent = {
    UA: {
        CONNECTING: 'connecting',
        CONNECTED: 'connected',
        DISCONNECTED: 'disconnected',
        REGISTERED: 'registered',
        UNREGISTERED: 'unregistered',
        REGISTRATION_FAILED: 'registrationFailed',
        REGISTRATION_EXPIRING: 'registrationExpiring',
        NEW_SESSION: 'newRTCSession',
        NEW_MESSAGE: 'newMessage',
        SIP_EVENT: 'sipEvent'
    },
    SESSION_PROGRESS: "progress",
    SESSION_FAILED: "failed",
    SESSION_ENDED: "ended",
    SESSION_ACCEPTED: "accepted",
    SESSION_CONFIRMED: "confirmed",
    SESSION_INCOMING: "incoming"
};

const remoteAudio = new window.Audio();
remoteAudio.autoplay = true;

const callOptions = {
    mediaConstraints: { audio: true, video: false },
    rtcOfferConstraints: { offerToReceiveAudio: true, offerToReceiveVideo: false }
};


//================================================================================
// Component Class
//================================================================================
export default class DemoSoftphone extends LightningElement {

    jsSipInitialized = false;
    session = null;
    phone = null;
    addStreamListener = null;

    renderedCallback() {
        if(this.jsSipInitialized) {
            return;
        }

        // initialize jssip
        this.jsSipInitialized = true;

        Promise.all([
          loadScript(this, JSSIP + '/jssip-3.3.11.js')
        ])
          .then(() => {
              this.initializeJsSip();
          })
          .catch(error => {
              console.log(error);
          });
    }

    initializeJsSip() {
        const socket = new JsSIP.WebSocketInterface('wss://xxx.xxx.com:5050');
        const config = {
            sockets: [ socket ],
            uri: 'sip:user@domain',
            password: 'password'
        };

        this.phone = new JsSIP.UA(config);

        this.phone.on(SIPEvent.UA.CONNECTING, (event)=> console.log('connecting:', event));
        this.phone.on(SIPEvent.UA.CONNECTED, (event)=> console.log('connected:', event));
        this.phone.on(SIPEvent.UA.DISCONNECTED, (event)=> console.log('disconnected:', event));
        this.phone.on(SIPEvent.UA.REGISTERED, (event)=> console.log('registered:', event));
        this.phone.on(SIPEvent.UA.UNREGISTERED, (event)=> console.log('unregistered:', event));
        this.phone.on(SIPEvent.UA.NEW_MESSAGE, (event)=> console.log('newMessage:', event));
        this.phone.on(SIPEvent.UA.SIP_EVENT, (event)=> console.log('sipEvent:', event));
        this.phone.on(SIPEvent.UA.REGISTRATION_FAILED, this.onRegistrationFailed);
        this.phone.on(SIPEvent.UA.NEW_SESSION, this.onNewSession);

        this.phone.start();
    }

    onRegistrationFailed = (event) => {
        alert('Registering on SIP server failed with error:', event.cause);
        console.log('Registering on SIP server failed with error:', event.cause);
    };

    onNewSession = (event) => {
        console.log('NEW RTC SESSION!');
    };

}
  • How did you determine that wss://xxx.xxx.com:5050 was the correct uri? – jami0821 Feb 12 at 14:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.