1

I'm trying to figure out how to create a Go room with Twilio-Video. The video connections works well, so I guess the token is valid. But there's no audio. In both directions. The relevant JS is below.

I've already looked through various guides and related questions, but I can't figure out where I'm going wrong. I assume the token is valid as well since the video connection is working. On the devices I tested, other video chat applications work well. I even tested different browsers, without any success.

Update 1
I've tried to start Chrome with --autoplay-policy=no-user-gesture-required to test if it's an issue with the autoplay policy. Unfortunately, the problem remains the same.

Update 2
Restarted my test devices, without any success.

Update 3
Tests https://networktest.twilio.com/ and https://webrtc.github.io/samples/src/content/devices/input-output/ were successful.

Browser log
Browser log if I and a peer join and leave the video call.

[3998:82691:0530/053811.743187:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/053812.372684:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/053833.884230:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/053833.902541:ERROR:webrtc_video_engine.cc(3350)] Absent receive stream; ignoring clearing encoded frame sink for ssrc 0
[3998:47363:0530/053835.045916:ERROR:turn_port.cc(1855)] Received TURN CreatePermission error response, code=403; pruned connection.
[3998:47363:0530/053835.046129:ERROR:turn_port.cc(1855)] Received TURN CreatePermission error response, code=403; pruned connection.
[3998:82691:0530/053848.634515:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/055416.022796:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/055416.620048:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/055438.608201:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[3998:82691:0530/055438.615202:ERROR:webrtc_video_engine.cc(3350)] Absent receive stream; ignoring clearing encoded frame sink for ssrc 0
[3998:47363:0530/055439.651049:ERROR:turn_port.cc(1855)] Received TURN CreatePermission error response, code=403; pruned connection.
[3998:82691:0530/055458.482652:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4192:84227:0530/060006.499133:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4192:84227:0530/060007.109077:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4306:47107:0530/061047.578035:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4306:47107:0530/061048.547660:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4316:84227:0530/061145.241086:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4316:84227:0530/061145.792233:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4316:84227:0530/061153.197745:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4316:84227:0530/061153.206282:ERROR:webrtc_video_engine.cc(3350)] Absent receive stream; ignoring clearing encoded frame sink for ssrc 0
[4316:83971:0530/061154.219117:ERROR:turn_port.cc(1855)] Received TURN CreatePermission error response, code=403; pruned connection.
[4316:84227:0530/061215.332750:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.
[4316:84227:0530/061215.926683:ERROR:audio_rtp_receiver.cc(88)] AudioRtpReceiver::OnSetVolume: No audio channel exists.

JS


let room;

// Called after page load.
const joinRoom = async (token, roomName) => {

    const Video = Twilio.Video;

    const localTracks = await Video.createLocalTracks({
        audio: true,
        video: { width: 1280, height: 720 },
    });
    try {
        room = await Video.connect(token, {
            name: roomName,
            tracks: localTracks,
        });
    } catch (error) {
        console.log(error);
    }

    const localMediaContainer = document.getElementById("local-media-container");
    localTracks.forEach((localTrack) => {
        localMediaContainer.appendChild(localTrack.attach());
    });

    try {
        room.participants.forEach(onParticipantConnected);
        room.on("participantConnected", onParticipantConnected);
        room.on("participantDisconnected", onParticipantDisconnected);
    } catch (error) {
        console.log(error);
    }

    // Mute audio button
    const muteBtn = document.getElementById('mute-btn');
    const unmuteBtn = document.getElementById('unmute-btn');
    muteBtn.onclick = function(event) {
        try {
            room.localParticipant.audioTracks.forEach(track => {
                track.track.disable();
            });
        } catch (error) {
            console.log(error);
        }
        muteBtn.classList.add('d-none');
        unmuteBtn.classList.remove('d-none');
    };
    unmuteBtn.onclick = function(event) {
        try {
            room.localParticipant.audioTracks.forEach(track => {
                track.track.enable();
            });
        } catch (error) {
            console.log(error);
        }
        unmuteBtn.classList.add('d-none');
        muteBtn.classList.remove('d-none');
    };

    // Stop video button
    const stopVideoBtn = document.getElementById('stop-video-btn');
    const startVideoBtn = document.getElementById('start-video-btn');
    stopVideoBtn.onclick = function(event) {
        try {
            room.localParticipant.videoTracks.forEach(track => {
                track.track.disable();
            });
        } catch (error) {
            console.log(error);
        }
        stopVideoBtn.classList.add('d-none');
        startVideoBtn.classList.remove('d-none');
    };
    startVideoBtn.onclick = function(event) {
        try {
            room.localParticipant.videoTracks.forEach(track => {
                track.track.enable();
            });
        } catch (error) {
            console.log(error);
        }
        startVideoBtn.classList.add('d-none');
        stopVideoBtn.classList.remove('d-none');
    };
};

const onParticipantDisconnected = (participant) => {
    const participantDiv = document.getElementById("peer-media-container");
    participantDiv.innerHTML = '<div class="d-flex flex-row w-100 h-100 align-items-center justify-content-center text-center text-white">Call ended.</div>';
};

const onParticipantConnected = (participant) => {
    const participantDiv = document.getElementById("peer-media-container");

    const trackSubscribed = (track) => {
        participantDiv.innerHTML = "";
        participantDiv.appendChild(track.attach());
    };
    participant.on("trackSubscribed", trackSubscribed);

    participant.tracks.forEach((publication) => {
        if (publication.isSubscribed) {
            trackSubscribed(publication.track);
        }
    });

    const trackUnsubscribed = (track) => {
        track.detach().forEach((element) => element.remove());
    };

    participant.on("trackUnsubscribed", trackUnsubscribed);
};

const onLeaveButtonClick = (event) => {
    room.localParticipant.tracks.forEach((publication) => {
        const track = publication.track;
        track.stop();
        const elements = track.detach();
        elements.forEach((element) => element.remove());
    });
    room.disconnect();
    close();
};

NoMorePen
  • 43
  • 2
  • 8
  • did your browser asked permission for audio and video? – Saddan May 30 '21 at 05:26
  • Yes, and I granted the permission. – NoMorePen May 30 '21 at 07:04
  • This is weird and I don't have any suggestions, aside from connecting directly to the Twilio Video team. To do so, I would recommend opening this question up as an [issue on the Twilio Video JS repo on GitHub](https://github.com/twilio/twilio-video.js/issues). Can you also share what devices you are testing on and whether you get this issue with other browsers, like Firefox. – philnash Jun 01 '21 at 01:22
  • Did you figure that out? I am having the same issue – bdemirka Feb 08 '23 at 15:09

0 Answers0