Hello I’m trying to create a video conferencing application based on Mediasoup but I get this error when I do a “transport.produce()” client-side.
Cannot destructure property 'id' of '(intermediate value)' as it is undefined.
I have no idea what it is due to, even after doing a lot of research, so I would like to know if you have a solution.
client-side
socket.once('transport.config', (data) => {
if (!device) return;
device.load({
routerRtpCapabilities: { codecs: rtp.mediaCodecs, headerExtensions: rtp.headerExtensions }
}).then(async () => {
if (device.canProduce('video')) {
const videoStream = await navigator.mediaDevices.getUserMedia({ video: true }).catch(console.error),
videoTrack = videoStream.getVideoTracks()[0];
const { sendTransport, rcvTransport } = data;
console.log(rcvTransport);
const transportSend = device.createSendTransport({ ...rcvTransport });
transportSend.on('connect', async ({ dtlsParameters }, callback, errback) => {
socket.emit('transport-connect', { dtlsParameters, transportId: rcvTransport.id });
socket.once('transport-connect-response', callback);
});
transportSend.on('produce', async ({ kind, rtpParameters, appData }, callback, errback) => {
socket.emit('transport-produce', {
transportId: rcvTransport.id,
kind,
rtpParameters,
appData
});
socket.once('transport-produce-response', callback);
});
transportSend.on('connectionstatechange', (connectionState) => console.log('TransportSend ConnectionState:', connectionState));
transportSend.produce({ track: videoTrack }).then((producer) => {
console.log('produced', producer);
}).catch(console.error);
} else {
console.log('cant do video');
}
}).catch(console.error);
});
server-side
const sendTransport = await router.createWebRtcTransport({
listenIps: [
{ ip: '127.0.0.1', announcedIp: null },
{ ip: '172.17.0.1', announcedIp: null },
],
enableUdp: true,
enableTcp: true,
preferUdp: true
});
sendTransport.on('icestatechange', (icestate) => console.log('IceState =>', icestate));
socket.once('transport-connect', ({ transportId, dtlsParameters }) => {
sendTransport.connect({ dtlsParameters });
console.log('connecting');
socket.emit('transport-connect-response');
});
socket.once('transport-produce', ({ transportId, kind, rtpParameters, appData }) => {
console.log('producing', kind, rtpParameters);
const produced = sendTransport.produce({ kind, rtpParameters, appData });
socket.emit('transport-produce-response');
});
socket.emit('transport.config', {
rcvTransport: {
id: sendTransport.id,
iceParameters: sendTransport.iceParameters,
iceCandidates: sendTransport.iceCandidates,
dtlsParameters: sendTransport.dtlsParameters,
sctpParameters: sendTransport.sctpParameters
}
});
Thank you in advance for your help.