1. Home
  2. Asterisk and FreeSWITCH
  3. FreeSWITCH WebRTC
Searching...

FreeSWITCH WebRTC

Contents

FreeSWITCH WebRTC: A Comprehensive Guide

WebRTC (Web Real-Time Communication) is an open-source technology that enables peer-to-peer (P2P) audio, video, and data sharing directly in the browser without plugins. Supported by major browsers, WebRTC is ideal for creating real-time communication applications. FreeSWITCH, a popular open-source telephony platform, can handle WebRTC signaling and media, making it a powerful choice for WebRTC-enabled applications.

This guide covers how to configure FreeSWITCH for WebRTC and demonstrates how to set up a SIP.js client for real-time communication.

Step 1: Setting Up FreeSWITCH for WebRTC

FreeSWITCH requires specific configurations to handle WebRTC signaling, WebSockets, and secure RTP (SRTP) for media transport.

Essential Modules and Configuration Files

  1. Enable WebSocket and SRTP Support:
  • WebRTC uses secure WebSocket (WSS) for signaling and SRTP for media transport.
  1. Verify Required Modules:
  • Ensure that the following modules are loaded: mod_sofia for SIP signaling, mod_v8 for JavaScript, and mod_rtp for RTP handling.

Configuring FreeSWITCH for WebRTC

1. Enable WebSocket (WSS) and Secure RTP (SRTP)

Edit sofia.conf.xml to enable WebSocket (WSS) and configure a WebRTC gateway.

<gateway name="webrtc_gateway">
    <param name="username" value="webrtc_user"/>
    <param name="password" value="password"/>
    <param name="realm" value="your-freeswitch-domain"/>
    <param name="register" value="false"/>
</gateway>

2. Configure SIP Profile for WebRTC

In internal.xml, modify the SIP profile to support WebRTC. Ensure that tls and wss-binding are enabled for secure WebSocket connections.

<profile name="internal">
    <settings>
        <param name="ws-binding" value="0.0.0.0:5066"/>
        <param name="wss-binding" value="0.0.0.0:7443"/>
        <param name="tls" value="true"/>
    </settings>
</profile>

3. Generate TLS Certificates

Generate self-signed certificates for testing or use trusted certificates for production. Update the wss-binding with the certificate path:

cd /usr/local/freeswitch/conf/ssl
openssl req -new -x509 -days 365 -nodes -out freeswitch.pem -keyout freeswitch.pem

Place the certificate paths in your FreeSWITCH configuration files to secure WebSocket (WSS) connections.

Step 2: WebRTC Client Setup with SIP.js

To connect to FreeSWITCH, we’ll use SIP.js, a JavaScript library that supports SIP over WebSocket.

Installing SIP.js

Include SIP.js in your HTML project:

<script src="https://unpkg.com/sip.js@0.20.0/dist/sip.min.js"></script>

SIP.js Client Configuration

Create a SIP.js client to register with FreeSWITCH:

const uri = 'sip:webrtc_user@your-freeswitch-domain';
const transportOptions = {
  wsServers: ['wss://your-freeswitch-domain:7443'],
  traceSip: true
};

// Initialize user agent
const userAgent = new SIP.UserAgent({
  uri: SIP.UserAgent.makeURI(uri),
  transportOptions: transportOptions,
  authorizationUsername: 'webrtc_user',
  authorizationPassword: 'password',
  sessionDescriptionHandlerFactoryOptions: {
    constraints: {
      audio: true,
      video: true
    }
  }
});

userAgent.start();

Make sure you read this article on How Secure is My Password, for valuable insight into SIP password security.

Making a Call with SIP.js

To initiate a call from SIP.js, create a session and invite the target URI:

function makeCall(targetUri) {
  const target = SIP.UserAgent.makeURI(targetUri);

  const options = {
    sessionDescriptionHandlerOptions: {
      constraints: {
        audio: true,
        video: true
      }
    }
  };

  const inviter = new SIP.Inviter(userAgent, target, options);

  inviter.stateChange.addListener((state) => {
    console.log(`Call state: ${state}`);
  });

  inviter.invite().catch(error => console.error("Call failed", error));
}

makeCall('sip:destination@your-freeswitch-domain');

Receiving a Call with SIP.js

To handle incoming calls, add an event listener for INVITE requests:

userAgent.delegate = {
  onInvite(invitation) {
    invitation.stateChange.addListener((state) => {
      console.log(`Incoming call state: ${state}`);
    });

    // Auto-answer the call
    const options = {
      sessionDescriptionHandlerOptions: {
        constraints: {
          audio: true,
          video: true
        }
      }
    };

    invitation.accept(options).catch(error => console.error("Failed to answer", error));
  }
};

With this configuration, the client automatically accepts incoming calls and establishes media connections.

Siperb simplifies WebRTC by providing a ready-to-use, robust framework that connects your existing PBX systems to WebRTC without the steep learning curve and development overhead. This not only accelerates deployment but also ensures that your solution is built on a foundation of proven reliability and enhanced security features. Additionally, SIPERB offers ongoing support and updates, which means you benefit from continuous improvements and adaptations to the latest communication technologies and standards, without diverting your internal resources away from your core business activities. https://www.siperb.com/

Conclusion

With FreeSWITCH configured as a WebRTC-compatible SIP server and SIP.js set up as the client, you can enable real-time voice and video communication in the browser. This guide provides step-by-step instructions for setting up FreeSWITCH with secure WebSocket connections and configuring SIP.js to make and receive WebRTC calls.

For production:

  • Secure WebSocket and SRTP with reliable certificates.
  • Test and monitor NAT traversal for optimal media quality.
  • Ensure compatibility across networks and browsers.

This setup gives you a strong foundation to build scalable, WebRTC-enabled communication applications with FreeSWITCH.

Related Articles