Mobile browser requires user action (button click) when starting to publish or play a media stream on mobile device. Also, audio must be muted in HTML5 video tag:
let video = document.createElement('video'); video.muted = true; |
When playing a stream, audio can be unmuted by user action only.
To workaround this, since WebSDK build 2.0.212 stream publishing or playback should be started on mobile device by the following rules:
1. If Websocket connection is already established, and a separate button is used to start publiushing or playback (Publish/Play button which user clicks), no additional actions required in application code
2. If Websocket connection is establishing by button click, then publishing/playback starts by SESSION_STATUS.ESTABLISHED
event, it is necessary to use playFirstVideo()
function for publishing
if (Browser.isSafariWebRTC()) { Flashphoner.playFirstVideo(localVideo, true, PRELOADER_URL).then(function() { publishStream(); }); return; } |
and playback
if (Flashphoner.getMediaProviders()[0] === "WSPlayer") { ... } else if (Browser.isSafariWebRTC() || Flashphoner.getMediaProviders()[0] === "MSE") { Flashphoner.playFirstVideo(remoteVideo, false, PRELOADER_URL).then(function () { playStream(); }); return; } |
The playFirstVideo
function returns a Promise, which is resolved if a test video fragment was successfully played in video element by PRELOADER_URL
.
3. If Websocket connection is establishing on page load, then playback starts by SESSION_STATUS.ESTABLISHED
event (autoplay), it is necessary to use playFirstVideo
and disable automatic unmute when stream is created
var options = { name: streamName, display: remoteVideo, flashShowFullScreenButton: true }; ... if (autoplay) { options.unmutePlayOnStart = false; } stream = session.createStream(options).on(STREAM_STATUS.PENDING, function (stream) { ... }); stream.play(); |