twilio / video-quickstart-js

A quickstart and code samples for Twilio Video JavaScript SDK. https://www.twilio.com/docs/video
Other
389 stars 337 forks source link

Use live media stream as participant voice instead of getUserMedia #184

Closed amandeepsinghdhammu closed 3 years ago

amandeepsinghdhammu commented 3 years ago

I want to add a hidden participant in a group video call to play song stream as participant's voice(without video), with some control like whenever we want to stop or start, we can. I'm trying to pass media stream from a URL as tracks while making a connect request to join room. I'm using quickstart example for this task:

try {
      // Fetch an AccessToken to join the Room.
      const response = await fetch(`/token?identity=${identity}`);

      // Extract the AccessToken from the Response.
      const token = await response.text();

      // Add the specified Room name to ConnectOptions.
      connectOptions.name = roomName;

      const audio = new Audio("http://mediaserv30.live-streams.nl:8086/live");
      const ctx = new (window.AudioContext || window.webkitAudioContext)();
      const stream_dest = ctx.createMediaStreamDestination();
      const source = ctx.createMediaElementSource(audio);
      source.connect(stream_dest);

      const stream = stream_dest.stream;

      console.log("==================", stream.getAudioTracks());

      const tracks = stream.getTracks().map(track => track.kind === 'audio' ? new LocalAudioTrack(track) : new LocalVideoTrack(track));

      connectOptions.tracks = tracks;

      await joinRoom(token, connectOptions);
}

Here is what I'm getting after running this:

Twilio-Video-QuickStart

Any help is really appreciated. I'm stuck on this problem from few days.

PikaJoyce commented 3 years ago

Hi @amandeepsinghdhammu,

Thank you for opening this issue. I'll take a look at this and get back to you with an answer! Thank you for your patience.

Best, Joyce

PikaJoyce commented 3 years ago

Hey there @amandeepsinghdhammu!

Again, thank you for your patience. I've fiddled around with your code snippet and noticed one thing. The error that is being thrown is not from your snippet but from another part in the code see here.

It seems that when you set connectOptions.tracks, there are no LocalVideoTracks present. Therefore, your connectOptions.tracks looks like: image.

Since you're only passing an audio track, you would never get a video track. I recommend creating a local video track somewhere, you can also publish a local video track after connecting as well if you don't want any video. Or simply remove this line and you should be able to connect.

I hope that helps, please let me know if you have any further questions. I'll be closing this ticket now but we can continue discussing if you've got further questions.

Best, Joyce