Supported Codecs
- H264, VP8, VP9 video codecs.
- Opus audio codec.
Supported Servers
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:
Property | Description | Default |
---|---|---|
publisher | Enable the player as the publisher. Which enables the full WebRTC encoder publishing application. | false |
serverURL | The host of the websocket service. For Wowza the url is configured from the host. | |
userData | Custom data to send to the Wowza server. This can be used in the custom websocket for authentication. | |
server | The server type. For conferencing, configure with the postfix -conference. | wowza |
debug | Turns on full peer connection debug logging. | false |
prefferedCodecs | A codecs filter for the preferred codec. For Wowza H264 requires a level filter. | { |
"audio": { | ||
"codec": "opus", | ||
}, | ||
"video": { | ||
"codec": "H264", | ||
"level": "42e01f" | ||
} | ||
} | ||
opus | Opus codec configs | { "stereo": 1 } |
ui | CSS selectors for managing external select menus with data and control of WebRTC and media options. Disable this if using external controls with the device data provided. | { |
"audioInput": "audioSource", | ||
"audioOutput": "audioOutput", | ||
"videoSource": "videoSource", | ||
"bandwidth": "bandwidth", | ||
"resolution": "resolution", | ||
"rates": "rates", | ||
"container": "#encoder-menu" | ||
} | ||
dataCallback | To manage the encoder controls externally, the device data is provided in this callback to build the device menus. And return with the configured options. | |
autoStartDevice | Enable to auto activate the device on initialisation. Or turned on when clicking the player. | false |
maxBitrateBitrate | Configure an initial max bitrate bitrate. This is required for Chrome to function with Wowza. | 2000 |
minVideoBitrate | Minimum video bitrate. Used on Chrome only. Wowza requires it to be the max bitrate. | 2000 |
startVideoBitrate | Starting video bitrate. Used on Chrome only. | 300 |
audioVideoBitrate | Audio codec bitrate. | 64 |
recording | Enable recording of the local stream with a download option. Config requires the filename for the download and the mimetype and codec. For H264 use video/mp4 and H264 as the codec. server enables server side recording commands. |
|
pcConstraints | Set browser specific Peer connection options. | |
toggleScreen | Enable camera / share screen switching features. | false |
floatedControls | Move all the controls buttons to underneath the player. | false |
transportTcp | Enable TCP transport for OvenMediaEngine | false |
seperateScreen | For video conference, start screen sharing as a seperate stream from the camera. | |
publishToken | JWT or other signed token to authenticate Wowza publishing using a custom provider module. | |
subscribeToken | JWT or other signed token to authenticate Wowza subscribing using a custom provider module. | |
peerStats | Enable peer stats collection | false |
peerStatsInterval | the interval for stats collection in ms | 5000 |
echoCancellation | Audio echo cancellation | true |
noiseSuppression | Audio noise suppression | true |
roomName | Conferencing room name required for some servers | |
adhocHls | Conferencing subscribe as HLS for Adhoc RTMP streams | false |
tokenService | Callback with a Promise to refresh a publishToken for Wowza publishing | |
meterAutoStart | Auto start the audio meter. When the audio meter is hidden in settings use the api methods to toggle on and off for performance reasons. | true |
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
Property | Description | Default |
---|---|---|
studioMode | Enable / disable conference studio mode. In studio mode participants first join a lobby. | true |
container | The container that wraps the room and featured container. | |
roomContainer | The container for the participants added to the room. | |
featuredContainer | The container for the featured participant. | |
lobbyContainer | The container selector for participants joining the conference lobby. | |
playerTemplate | The player container template. | |
lobbyPlayerTemplate | The lobby player container template. | |
mergerContainer | The container selector for the WebGL video merger for broadcasting and recording group conferences. | |
bgImage | The background image to use as a texture for the video merger view. | |
autoPublish | Automatic broadcast the video merger stream when the master is publishing. | |
host | Enable participant as the conferencing master. This enables the conferencing api methods. | |
hlsTemplate | When using Wowza. The HLS url template to use when subscribing in a group call as HLS. | https://{serverURL}/{appName}/{streamName}/playlist.m3u8 |
dashTemplate | When using Wowza. Configure a dash template to subscribe to either RTMP or server side streams. | |
subscribeHls | Set to true to subscribe to remote participants in a group call as HLS instead of WebRTC. | |
peerSubscribe | Required for Kurento group call conferencing. | |
maxWidth | Maximum width for the conferencing merger WebGL renderer | 1280 |
maxHeight | Maximum height for the conferencing merger WebGL renderer | 720 |
layoutStates | A set of room layout states css selectored that can be updated on the room. This changes the layout of the featured participant mode. And stretched mode for two or three participants. | ["stretch", "right", "bottom", "room-default", "overlayed"] |
stalledInterval | The interval to checked for stalled peer subscribes | 5000 |
fullscreenFeatured | Enable featuring participants using the fullscreen player button | true |
subscribeMerger | Enable participat as a merger stream subscriber | false |
Subscriber Options
Property | Description | Default |
---|---|---|
serverURL | The host of the websocket service. For Wowza the url is configured from the host. | |
server | The server type. For now Wowza is supported with other signalling servers after. | wowza |
userData | Custom data to send to the Wowza server. | |
debug | Turn on internal peering logs. | false |
Virtual Background Removal Plugin Options
Property | Description | Default |
---|---|---|
renderType | The background rendering type. Either mediapipe, or screen | mediapipe |
bgImage | url to the background image to use as a video background. | |
bgImage | The background poster image for the background texture of the video rendering. | |
backgroundColor | Set a background color instead of a background image. | |
scaledWidth | The width to scale the video to when switching to screensharing as the background. In a percentage of the screen width. | |
maxHeight | a max height to set the rendering canvas. A canvas stream uses software encoding therefore more cpu in 1080p so a height restriction is needed for efficient cpu usage. |
Player API Methods
Mathod | Description | Arguments |
---|---|---|
togglePublish | Toggle publishing | |
toggleRecord | Toggle local or server recording | |
toggleDevices | Toggle media devices on / off | |
startDevice | Start the media device | |
toggleAudio | Mute / unmute audio tracks | |
toggleVideo | Toggle video tracks off / on | |
toggleScreenShare | Launch screen sharing | |
send | Send data over a data channel for servers that support it. | |
sendSignalMessage | Send a message over websocket | |
getDevices | Get the available devices in a map list | |
getDevice | Get a specific device with a specific media constraint and specificed by an index | constraint, videoIndex, audioIndex |
setStream | Replace the stream with a specific MediaStream | MediaStream |
setVideoStream | Replace the video track with a specific MediaStream track | videostream |
setAudioGain | Set the output publish audio gain of 0-1 | audiogain |
downloadRecording | For local recording download the generated recording | |
getParticipants | Get available conferencing participants | |
getParticipant | Get a specific participant specified by the stream name | |
featureParticipant | Make a participant the speaker. Specified by selected participant or argument. | name |
removeFeaturedParticipant | Remove a participant the speaker. Specified by selected participant or argument. | name |
toggleMuteParticipant | Mute a participant. Specified by selected participant or argument. | name |
addToRoom | Add participant to the room from the lobby in conference studio mode | name |
removeFromRoom | Remove participant from the room | name |
startPlaylistStream | Start server playlist when using Wowza | name, playlist |
stopPlaylistStream | Stop server playlist | name |
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.
Property | Description | Default |
---|---|---|
roomCheckInterval | Interval to check for new participant streams | 5000 |
pingInterval | Server keep alive interval | 30000 |
enablePing | Enable keep alive poller | false |
mode | Publishing mode | legacy |
token | Publish / subscribe stream token | |
subscriberId | Used to generate thesecurity OTP code | |
subscriberCode | The security OTP code | |
apiKey | The JWT key for the rest service. Required for server side recording |
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": ""
}
}
Property | Description | Default |
---|---|---|
accountId | Dolby.io account id shown in the api key section. | |
publishToken | The publishing token created in the api section. This is used for generating the signal server url unless supplied using serverURL | |
subToken | Subscriber token generated by the backend using the secret key and Dolby.io api. This is used when authenticated subscriber is enabled for the publish token. | |
userData | Custom data to send to the Wowza server. | |
debug | Turn on internal peering logs. | false |
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.
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.
Property | Description | Default |
---|---|---|
transportTcp | Enable TCP transport. Seems to be required for the Docker image. | false |
policy | Signed Policy token for stream security |
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": ""
}
}
Property | Description | Default |
---|---|---|
region | The AWS region for the signalling channel. | |
publishToken | The publishing token for custom AWS Lambda authorizer. | |
subcribeToken | The viewer subscriber token for custom AWS Lambda authorizer. | |
accessKeyId | The AWS access key id | |
secretAccessKey | The AWS secret key |
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
Property | Description | Default |
---|---|---|
transportTcp | Enable tcp ice candidate communication. | |
sinportPort | Enable ice candidate communication over a single port. | |
publicIp | The public ip of the server for ice candidate resolving. | |
publishToken | The password used for publishing | |
secureToken | The token for playback security. |
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>