0 Replies
      Latest reply on May 21, 2020 4:33 PM by chen209
      chen209 Level 1 Level 1 (0 points)

        I'm using WebRTC on iOS Safari in a client-server model where the browser serves as the client to receive media stream from a WebRTC server.

         

        On the client side, we ask the user for microphone access and use addTransceiver() API to negotiate the PeerConnection with the server. Once the browser gets the media stream with both video and audio from the server, the video will automatically play with "autoplay" and "playsInline" attributes in the <video>.

         

        In cases where the user declines the microphone access, the video will not be automatically played. According to Webkit doc, this is expected because it's a one-way video conference scenario, and requires user gesture to start the video. However I'm able to start the video programmatically in peerconnection.ontrack() callback, which I'm not sure if this is an expected behavior. Because as the Safari blog described, the video requires user gesture such as "a handler for a touchend, click, doubleclick, or keydown event". In this case, is peerconnection.ontrack() counted as a user gesture? Is it the best way to autoplay to video in this scenario?

         

        Additionally we noticed that on MDN doc, addTransceiver() API is tagged as "not supported" for iOS Safari. We've been testing on iOS 13.4.1 and it was working fine. Is this API already fully supported?

         

        Tested device/OS:

        iPhone 11 with iOS 13.4.1

         

        Code details:

         

        <video autoplay playsInline />

         

        addTransceiver() API:

        peerconnection.addTransceiver('video', {direction: 'recvonly'});
        userMediaStream = await navigator.mediaDevices.getUserMedia({audio: true});
        peerconnection.addTransceiver('audio', {direction: 'sendrecv'});
        // we will re-add a transceiver with 'recvonly' audio if the user declines microphone access

         

        video.play() on ontrack callback:

        peerconnection.ontrack = (event: RTCTrackEvent) => {
          videoElement.srcObject = event.streams[0];
        
          if (this.videoElement.paused) {
            this.videoElement.play();
          }
        };