i am consuming from following code on front end nextjs
const consume = async (producerId: string) => {
console.log('producerId', producerId);
// console.log('device rtpCapabilities', device.rtpCapabilities);
if (!device.rtpCapabilities) {
console.error('Device RTP capabilities are not available');
return;
}
socket.emit('consume', { producerId, rtpCapabilities: device.rtpCapabilities }, async (params: ConsumeParams) => {
console.log('recvTransport test', recvTransport);
console.log('recvTransport params', params);
const consumer: mediasoupClient.types.Consumer = await recvTransport.consume({
id: params.id,
producerId: params.producerId,
kind: params.kind,
rtpParameters: params.rtpParameters,
// paused:true,
paused: true
});
console.log('consumer 77777777', consumer);
// Check if the consumer.track is valid
if (!consumer.track) {
console.error('consumer.track is undefined or null');
return;
}
// Check if the track is a video track and its state
if (consumer.track.kind === 'video' && consumer.track.readyState === 'live') {
console.log('Received a valid live video track:', consumer.track);
const stream = new MediaStream();
stream.addTrack(consumer.track);
// Check if the stream contains video tracks
if (stream.getVideoTracks().length > 0) {
console.log('Stream contains video tracks:', stream.getVideoTracks());
// Add stream to remote streams
setRemoteStreams((prev) => [...prev, stream]);
socket.emit('consumer-resume', {
serverConsumerId: params.id,
});
} else {
console.error('No video tracks in stream:', stream);
}
} else {
console.error('Invalid track or track not live:', consumer.track.readyState, consumer.track.kind);
}
});
};
below is screen shot as well with log consumer 7777 still it is showing _paused false although i set paused as true
below is screenshot for mediastream which i am getting from other participants still in video element showing nothing