Audio echo/feedback in video call using Video SDK

Sendbird Voice/Video Calls
,
1

I’ve added video chats to our web application (built in React) and have begun testing. The couple of tests I’ve run had extremely loud audio echos/feedback - so much so that it was unusable. Is this a known issue?

1 Like
2

Hey @Chris,

I’ve not seen any reports of this yet. Could you let us know how you’re testing this? Is it possible there is echo/feedback based on your input and output selection and the possibility they’re looping?

3

Hey @Tyler - yes, please see the attached relevant code. 1 user was in Microsoft Edge on Windows, the other was in Chrome on a Mac. Both users were on headphones.

SendBirdCall.init('xxxx');
        const authOption = {
            userId: sendBirdDataResponse.data.sendBirdUserId,
            accessToken: sendBirdDataResponse.data.sendBirdAccessToken
        };
        SendBirdCall.authenticate(authOption, (result, error) => {
            if (error) {
                // Handle authentication failure.
            } else {
                // The user has been successfully authenticated and is connected to Sendbird server.
                // Establishing websocket connection.
                SendBirdCall.connectWebSocket()
                    .then(() => {
                        if (!chatGroup.sendBirdRoomId) {
                            SendBirdCall.createRoom({ roomType: SendBirdCall.RoomType.SMALL_ROOM_FOR_VIDEO })
                                .then(room => {
                                    this.room = room;
                                    this.enterRoom();
                                }).catch(e => {
                                    // Failed to create a room.
                                });
                        }
                        else {
                            SendBirdCall.fetchRoomById(chatGroup.sendBirdRoomId)
                                .then(room => {
                                    this.room = room;
                                    this.enterRoom();
                                })
                                .catch(e => {
                                    // Handle error
                                });
                        }
                    })
                    .catch(/* nothing */);
            }
        });

enterRoom = () => {
        const enterParams = {
            videoEnabled: true,
            audioEnabled: true
        };
        this.room.enter(enterParams)
            .then(() => {
                // User has successfully entered `room`.
                const localMediaView = document.getElementById('local_video');
                this.room.localParticipant.setMediaView(localMediaView);
                this.room.on('remoteParticipantEntered', (remoteParticipant) => {
                    if (remoteParticipant.participantId !== this.room.localParticipant.participantId) {
                        this.getOrCreateRemoveVideoDiv(remoteParticipant.participantId);
                    }
                });
                this.room.on('remoteParticipantExited', (remoteParticipant) => {
                    let obj = document.getElementById('remote_' + remoteParticipant.participantId);
                    obj.remove();
                });
                this.room.on('remoteParticipantStreamStarted', (remoteParticipant) => {
                    if (remoteParticipant.participantId !== this.room.localParticipant.participantId) {
                        let divObj = this.getOrCreateRemoveVideoDiv(remoteParticipant.participantId);
                        remoteParticipant.setMediaView(divObj.firstChild);
                    }
                });
            })
            .catch(e => {
                // Handle error.
            });
    }
4

Does this only occur when you’re using video?

5

I hadn’t tried audio only if that’s what you mean. This block of code is the only Sendbird implementation we have in the app.

6

Hey @Tyler - just wondering if there are any updates on this? Happy to share whatever is needed to try to resolve this.

7

Hi @chris ,

This slipped off my radar. I apologize. I’ll make this my priority in the AM and see if I can get you some answers.

8

Cool, thanks. FWIW - I tried again today with a different person in a different country. This person was on a Windows machine using Chrome, but we ran into the same issue - there was a bad echo that made it unusable. This is on a publicly available machine btw - happy to test if you’d like.

9

@Tyler - I tried with the newly updated version of the Javascript client. Same issue. Were you able to look into this at all?

10

Hey @chris, sorry for the lack of response. I have taken a look at it and I’ve not yet been able to reproduce the issue. I’m trying to find ways that it could be introduced but am not having any luck.

11

I can hear myself through the speakers when I am talking. Is there perhaps a way to turn off the incoming audio stream from my current connection?

12

Actually, I think I may have just found whats going on. In your code when you’re entering the room, could you add localMediaView.muted = 'muted';, and try again?

I’d set it just after:

this.room.localParticipant.setMediaView(localMediaView);
13

Awesome, that was it. Just changed the HTML for the local video to:

<video id="local_video" autoPlay muted />

And that resolved it. Thanks again for the help - much appreciated.

1 Like