When video should be played on mobile device, browser can require some user actions by default (button pressing etc). To bypass this, playFirstSound() function (when stream is played using WSPlayer only) and playFirstVideo() function (when stream is played via WebRTC in iOS Safari and via MSE in another browsers) should be called as follows:

Common rules

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

code

        if (Browser.isSafariWebRTC()) {
            Flashphoner.playFirstVideo(localVideo, true, PRELOADER_URL).then(function() {
                publishStream();
            });
            return;
        }

and playback

code

        if (Flashphoner.getMediaProviders()[0] === "WSPlayer") {
            Flashphoner.playFirstSound();...
        } else if (Browser.isSafariWebRTC() || Flashphoner.getMediaProviders()[0] === "MSE") {
            Flashphoner.playFirstVideo(remoteVideo, false, PRELOADER_URL).then(function () {
                startplayStream();
            });
            return;
        }

The playFirstVideo function returns a Promise, which is resolved if a test video fragment was successfully played in remoteVideo page video element by URL PRELOADER_URL. When Promise is resolved, server video stream playback can be run in this video element. If Promise was rejected, playback can not be run.This function should be called to play any video including SIP video call. .

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

code

    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();

Stream publishing and playback in Low Power Mode

In Low Power Mode on iOS devices, user action is mandatory to publish or play media stream. Autoplay does not work in this mode. Use the function playFirstVideo to detect Low Power Mode: a Promise returned by the function will be rejected:

code

                if (Browser.isSafariWebRTC()) {
                    Flashphoner.playFirstVideo(pDisplay, false, PRELOADER_URL).then(function() {
                        playStream(participant, pDisplay);
                    }).catch(function (error) {
                        // Low Power Mode detected, user action is needed to start playback in this mode
                        console.log("Can't atomatically play participant" + participant.name() + " stream, use Play button");
                        onParticipantStopped(participant);
                    });
                }