WebRTC Low Latency Streaming Plugin Documentation

Supported Codecs

• H264, VP8, VP9 video codecs.
• Opus audio codec.

Supported Servers

Ant Media Server

Wowza Streaming Engine

Wowza Video at Scale

Dolby.IO

Kurento Media Server

Amazon Kinesis Video

OvenMediaEngine

Unreal Media Server

WebRTC Streaming Configuration

Publisher Configuration

To enable a player as a publisher set the player needs the publisher config enabled.

{
    "rtc": {
        "publisher": true
    }
}

Configuring stream name and server application

{
    clip: {
        "live": true,
        "sources": [
            { "type": "application/webrtc", "src": "myStream", "appName": "webrtc"}
        ]
    }
}

Server Configuration

The server config, sets up WebRTC connectivity with a particular server.

• antmedia
• wowza
• kurento
• dolbyio
• kinesisvideo
• ovenmedia
• unrealmedia
• antmedia-conference
• wowza-conference
• kurento-conference
• dolbyio-conference
• ovenmedia-conference

Options

Here is a list of the configuration options:

Peer Connection Options

{
    "optional": [
        { "googIPv6": true },
        { "googImprovedWifiBwe": true },
        { "googDscp": true },
        { "googSuspendBelowMinBitrate": true },
        { "googScreencastMinBitrate": 300 },
        { "googCombinedAudioVideoBwe": true },
        //turn off resolution changes
        { "googCpuOveruseDetection": false },
        { "googCpuOveruseEncodeUsage": false },
        { "googCpuUnderuseThreshold": 55 },
        { "googCpuOverUseThreshold": 85 }
    ]
}

Enable Stream Recording

{
    "mimeType": "video/webm",
    "codec": "VP9",
    "name": "recording1"
}

WebRTC Group Call Conferencing Options

Subscriber Options

Virtual Background Removal Plugin Options

Player API Methods

updateRoomConfig | Updates the room configuration signalled to other participants with any json config. getRoomConfig | Gets the current room config signalled to the server. setRoomState | Sets the current room state layout. For changing position of participants in featured view and stretched view. getRoomState | Get the current room state sendRoomMessage | Signal a custom message to the room getParticipants | Get the current participants added to the room. getLobbyParticipants | Get the current lobby participants. getParticipant | Get information for the current room participant. getLobbyParticipant | Get information for the current lobby participant. startMeter | Enable the audio meter stopMeter | Disable the audio meter toggleAudioMeter | Toggle the audio meter on and off

Wowza WebRTC Configuration

Provided is a set of example configs for wowza with install script to get the WebRTC signal server working. Provided is a script to convert PEM SSL certificates into JKS format for Wowza.

An SSL certificate is required to be configured into the Secure SSL provider config inside VHost.xml.

The Websocket provider also needs to be configured inside VHost.xml

Enable Wowza Websocket

Enabled within the SSL host within the VHost.xml

<HTTPProvider>
    <BaseClass>com.wowza.wms.webrtc.http.HTTPWebRTCExchangeSessionInfo</BaseClass>
    <RequestFilters>*webrtc-session.json</RequestFilters>
    <AuthenticationMethod>none</AuthenticationMethod>
</HTTPProvider>

Rest api for server recording

Enable a custom api http provider for server recording for publishers.

<HTTPProvider>
    <BaseClass>org.electroteque.StreamRecorderProvider</BaseClass>
    <RequestFilters>*api</RequestFilters>
    <AuthenticationMethod>none</AuthenticationMethod>
</HTTPProvider>

Enable Custom Wowza Websocket

Provided is a custom websocket Wowza project to enable stream authentication.

<HTTPProvider>
    <BaseClass>org.electroteque.webrtc.HTTPProviderGroupCallWebSocket</BaseClass>
    <RequestFilters>*webrtc-room-session.json</RequestFilters>
    <AuthenticationMethod>none</AuthenticationMethod>
</HTTPProvider>

Wowza WebRTC Conferencing Configuration

To enable the conferencing examples. The supplied WebRTCCustomSignalServer Wowza IDE project, needs to be imported and built to be configured and loaded.

This provides the custom WebRTC signal server for WebRTC publishing with token protection. Another WebSocket provider is for group call signal messaging and to notify when a WebRTC publish begins.

<HTTPProvider>
    <BaseClass>org.electroteque.webrtc.HTTPWebRTCExchangeSessionInfoCustom</BaseClass>
    <RequestFilters>*webrtc-session.json</RequestFilters>
    <AuthenticationMethod>none</AuthenticationMethod>
</HTTPProvider>
<HTTPProvider>
    <BaseClass>org.electroteque.webrtc.HTTPProviderGroupCallWebSocket</BaseClass>
    <RequestFilters>*webrtc-room-session.json</RequestFilters>
    <AuthenticationMethod>none</AuthenticationMethod>
</HTTPProvider>

Wowza Security Token

JWT Token support makes used of RSA certificates for authentication. That need to be hosted in Wowza and on the application server end.

Supplied is an example spring application to generate the JWT tokens using RSA certificates supplying an expiry and an issuer.

Ant Media Server Options

For publish and subscribe stream tokens and video conferencing interval settings.

Ant Media Server WebRTC Configuration

SSL is required to be configured for WebRTC to function. Ant Media supplies a helper script to import an SSL certificate and private key into the server host configs.

Documentation for SSL setup.

For Letsencrypt SSL configuration , the helper script generates this internally. This requires port 80 external access for the verification server.

sudo ./enable_ssl.sh -d example.com

If the verification server is inaccessible. A DNS verification is possible to be imported into the script. Letsencrypt scripts are supplied for generating these certificates.

certbot -d example.com -m [email protected] --manual --preferred-challenges dns certonly

Import external generated certificates

sudo ./enable_ssl.sh -f yourdomain.crt -p yourdomain.key -c yourdomainchain.crt -d yourdomain.com

Dolby.io Options

{
    "dolbyio": {
        "accountId": "",
        "publishToken": "",
        "subToken": ""
    }
}

Dolby.io WebRTC Configuration

In the Dolby.io console. A streamname is required to be added. This will generate a publish key. A wildcard asterix can be used to link a publish key to any stream name. Click the Token Required next to the Secure Viewer section. This turns on token authentication for subscribers.

After adding a stream. A Publish key and Account ID is displayed to configure the publisher and subscriber with.

Dolby Alternative Audio Track Switching

Alternative audio switching is supported with Dolby.io with the support of Multi Source Broadcasting.

When a second audio only stream source is broadcasting, the source will become active in an audio language tracks menu.

Using an audio mixer feature the main audio can be mixed with the second selected audio using a config mixAudio and main audio level changed using a config switchedMainVolume and the language track audio volume is set with switchedLangVolume. Or switched between tracks.

To prepare for multi language track support the main source name can be configured to anything. For the seperate audio language track the source name needs to be set with a prefix of lang_audio_ and the language code ie lang_audio_de. The language code will be parsed and a label created. Or set the source name as the language label.

The main source id to use for publishing has no source id

NrD6zA75oEgY?t=token&simulcastId&sourceId=0

The second source id for publishing will be displayed in the console ie. audioOnly param is required on the publish stream name.

NrD6zA75oEgY%3Ft%3Dtoken%3Dlang_audio_de%26audioOnly"

For the audio language track to work an audio only stream is required to be published with no video.

ffmpeg -re -i audio/eng.wav -c:a aac -f mpegts "srt://srt-auto.millicast.com:10000?streamid=NrD6zA75oEgY%3Ft%3Dtoken%3Dlang_audio_de%26audioOnly"

Generating Subscriber Token

Using the Dolby.io API. A subscriber token can be generated with domain restriction. This requires the Secret Key which is different to the Publish Key. A helper script is supplied to generate these tokens and test the tokens work with the api.

curl -H "Authorization: Bearer secretkey" -H "Content-Type: application/json" https://api.millicast.com/api/subscribe_token -d '{"label": "LiveStreamLabel", "streams": [{"streamName": "StreamName"}], "allowedOrigins": ["*.domain.com"]}'

Ovenmedia Engine Options

For publish and subscribe stream tokens and tcp connection settings.

AWS Kinesis Options

Supplied is lambda and authorizer scripts to handle the signal channel ice servers and signed WebSocket url. Supplied is scripts to generate encrypted JWE tokens for the token authorizer. JWE provides encrypted token payloads.

"kinesisvideo": {
            "publishUrl": "https://api.electroteque.org/publish",
            "publishToken": "eyJhbGciOiJBMjU2S1ciLCJlbmMiOiJBMjU2Q0JDLUhTNTEyIn0.jtz-Wru3hxJlLmaBcgPzHgLwn-wPHEgo_cRRFg6DhR0toIHFBPmKXDUTaVlG_jBCo9TQ8VPFXoI03UK4QBOYXcKdgog0EOf7._TKhqyvVDOkZLw83ObkXVg.NFTZe7zRQH-syEC6Zn2izADtOdbM6tGyrGycfd7DYh3M7npPdXltMu50uQG8Q-A-09p4-TimibbevbxxShBjTaCGwZBMfevdQW6KNQiLXAFQSP2rlqfTK-Kf-cT-RZ3_VeeGopbWhzJ-AJbwVDV3_uQ8R0yPP2TanfBiy8etb5mNzqexbqRp5PFI7P54amcj.qmVpOoZi1mByhN88n8Jl_7Rune9cTnBNTf6neWrpEQE",
}

"kinesisvideo": {
            "subscribeUrl": "https://api.electroteque.org/subscribe",
            "subscribeToken": "eyJhbGciOiJBMjU2S1ciLCJlbmMiOiJBMjU2Q0JDLUhTNTEyIn0.acMKeL-pp0aAxlYeV3C3YzqxgCq2uPnBlEae7SCsV3ic4nBQt207lfL1-XinVvVHXUVkG2r3-S2TFtsbNNchhNscFH_FiVxh.qZ9fmfleXUtXfvHChFwPNg.Zx_9MSy4osZsT0VUYZF3C9Mknc8o3vigrcVZUboO9TBWZu8DpUdxBmR3ddA4Dk--Zjl6_5un9nBXD7z2ZKMbjsaqT2w4udI9WNjOstpSFjhbtC6e7laOfBv2ZIeKGfkk8ogZ3ZnYyXlyU6zM1nAvKfD3DezTCPzVQbHMa5N6bOlYJce4lCl_2wwWtgi-NFfBv8z-ZrcOzxlx9HrqUqUyAA.fybw2HIJANCYuaKli1I2xbt3606WdyGqeYADVLvh2LE"
}

"kinesisvideo": {
            "credentials": {
                "accessKeyId": "",
                "secretAccessKey": ""
            }
}

Kurento WebRTC Configuration

Kurento Media Server comes in two parts. The Kurento Media Server and a java / node JSONRPC client WebSocket server.

Provided is a one to many application aswell as a group call application to run the group call example.

The one to many application endpoint is one2many

The group call application endpoint is groupcall

Start the Kurento server first with

export MAKEFLAGS="-j$(nproc)"
./bin/kms-build-run.sh

Start the Kurento client Websocket server with

mvn -U clean spring-boot:run -Dkms.url=wss://localhost:8433/kurento

Unreal Media Options

Vue.JS Support

Vue.JS 2 is supported. The plugin needs to be treated as a 3rd party script and loaded externally before initializing the player. The CSS can be imported as normal. A window variable videojs is required. Example documentation is provided. Example documentation.

<template>
  <div>
    <video autoplay muted playsinline webkit-playsinline ref="videoPlayer" class="video-js"/>
  </div>
</template>

<script lang="ts">
import {Component, Ref, Vue} from 'vue-property-decorator';
import { loadScript } from "vue-plugin-load-script";
import videojs, {VideoJsPlayer} from 'video.js';
import "video.js/dist/video-js.css";


declare module 'video.js' {
  export interface VideoJsPlayer {
    rtcsubscriber: (options?: Partial<any>) => any;
  }
}

declare global {
    interface Window { videojs: any }
}

@Component
export default class App extends Vue {
  @Ref("videoPlayer") private videoPlayerEl!: HTMLVideoElement;
  private videoJsPlayer!: VideoJsPlayer;

  beforeCreate() {
    window.videojs = videojs;
  }

  mounted() {
    //load plugin then initialize player
    loadScript("js/webrtc-subscriber-7.10.1.js")
    .then(() => {
      this.videoJsPlayer = videojs(this.videoPlayerEl, {
        aspectRatio: "16:9",
        controls: true,
        liveui: true,
        "sources": [
            { "type": "application/webrtc", "src": "myStream", "appName": "webrtc"},
            { "type": "application/x-mpegurl", "src": "http://rtc.electroteque.org:1935/webrtc/myStream_360p/playlist.m3u8"}
        ],
        plugins: {
          "rtcsubscriber": {
                "applicationName": "webrtc",
                "debug": true,
                "server": "antmedia",
                "server": "wowza",
                "serverURL": "rtc.electroteque.org"
            }
        }

      });
    })
    .catch(() => {
      // Failed to fetch script
    });




  }

  beforeDestroy() {
    if (this.videoJsPlayer) {
      this.videoJsPlayer.dispose()
    }
  }
}
</script>
<style lang="scss">


</style>