Update client to consume audio correctly

This commit is contained in:
Sergiu Toma 2023-02-11 21:30:21 +02:00
parent 6b822142d0
commit 33ea44ac02
2 changed files with 58 additions and 52 deletions

View File

@ -20453,9 +20453,9 @@ setTimeout(() => {
if (IS_PRODUCER && urlParams.get('testing') === 'true') { getLocalStream() } if (IS_PRODUCER && urlParams.get('testing') === 'true') { getLocalStream() }
}) })
socket.on('new-producer', ({ callId }) => { socket.on('new-producer', ({ callId, kind }) => {
console.log(`🟢 new-producer | callId: ${callId} | Ready to consume`); console.log(`🟢 new-producer | callId: ${callId} | kind: ${kind} | Ready to consume`);
consume() connectRecvTransport();
}) })
} }
@ -20735,6 +20735,8 @@ const connectSendTransport = async () => {
// Enable Close call button // Enable Close call button
const closeCallBtn = document.getElementById('btnCloseCall'); const closeCallBtn = document.getElementById('btnCloseCall');
closeCallBtn.removeAttribute('disabled'); closeCallBtn.removeAttribute('disabled');
createRecvTransport();
} }
const createRecvTransport = async () => { const createRecvTransport = async () => {
@ -20774,7 +20776,8 @@ const createRecvTransport = async () => {
errback(error) errback(error)
} }
}) })
connectRecvTransport() // We call it in new-rpoducer, we don't need it here anymore
// connectRecvTransport()
}) })
} }
@ -20907,29 +20910,29 @@ const closeCall = () => {
resetCallSettings() resetCallSettings()
} }
const consume = async () => { // const consume = async (kind) => {
console.log('[consume]') // console.log(`[consume] kind: ${kind}`)
console.log('createRecvTransport Consumer') // console.log('createRecvTransport Consumer')
await socket.emit('createWebRtcTransport', { sender: false, callId, dispatcher: true }, ({ params }) => { // await socket.emit('createWebRtcTransport', { sender: false, callId, dispatcher: true }, ({ params }) => {
if (params.error) { // if (params.error) {
console.log('createRecvTransport | createWebRtcTransport | Error', params.error) // console.log('createRecvTransport | createWebRtcTransport | Error', params.error)
return // return
} // }
consumerTransport = device.createRecvTransport(params) // consumerTransport = device.createRecvTransport(params)
consumerTransport.on('connect', async ({ dtlsParameters }, callback, errback) => { // consumerTransport.on('connect', async ({ dtlsParameters }, callback, errback) => {
try { // try {
await socket.emit('transport-recv-connect', { // await socket.emit('transport-recv-connect', {
dtlsParameters, // dtlsParameters,
}) // })
callback() // callback()
} catch (error) { // } catch (error) {
errback(error) // errback(error)
} // }
}) // })
connectRecvTransport() // connectRecvTransport()
}) // })
} // }
btnLocalVideo.addEventListener('click', getLocalStream) btnLocalVideo.addEventListener('click', getLocalStream)
btnRecvSendTransport.addEventListener('click', consume) btnRecvSendTransport.addEventListener('click', consume)

View File

@ -95,9 +95,9 @@ setTimeout(() => {
if (IS_PRODUCER && urlParams.get('testing') === 'true') { getLocalStream() } if (IS_PRODUCER && urlParams.get('testing') === 'true') { getLocalStream() }
}) })
socket.on('new-producer', ({ callId }) => { socket.on('new-producer', ({ callId, kind }) => {
console.log(`🟢 new-producer | callId: ${callId} | Ready to consume`); console.log(`🟢 new-producer | callId: ${callId} | kind: ${kind} | Ready to consume`);
consume() connectRecvTransport();
}) })
} }
@ -377,6 +377,8 @@ const connectSendTransport = async () => {
// Enable Close call button // Enable Close call button
const closeCallBtn = document.getElementById('btnCloseCall'); const closeCallBtn = document.getElementById('btnCloseCall');
closeCallBtn.removeAttribute('disabled'); closeCallBtn.removeAttribute('disabled');
createRecvTransport();
} }
const createRecvTransport = async () => { const createRecvTransport = async () => {
@ -416,7 +418,8 @@ const createRecvTransport = async () => {
errback(error) errback(error)
} }
}) })
connectRecvTransport() // We call it in new-rpoducer, we don't need it here anymore
// connectRecvTransport()
}) })
} }
@ -549,29 +552,29 @@ const closeCall = () => {
resetCallSettings() resetCallSettings()
} }
const consume = async () => { // const consume = async (kind) => {
console.log('[consume]') // console.log(`[consume] kind: ${kind}`)
console.log('createRecvTransport Consumer') // console.log('createRecvTransport Consumer')
await socket.emit('createWebRtcTransport', { sender: false, callId, dispatcher: true }, ({ params }) => { // await socket.emit('createWebRtcTransport', { sender: false, callId, dispatcher: true }, ({ params }) => {
if (params.error) { // if (params.error) {
console.log('createRecvTransport | createWebRtcTransport | Error', params.error) // console.log('createRecvTransport | createWebRtcTransport | Error', params.error)
return // return
} // }
consumerTransport = device.createRecvTransport(params) // consumerTransport = device.createRecvTransport(params)
consumerTransport.on('connect', async ({ dtlsParameters }, callback, errback) => { // consumerTransport.on('connect', async ({ dtlsParameters }, callback, errback) => {
try { // try {
await socket.emit('transport-recv-connect', { // await socket.emit('transport-recv-connect', {
dtlsParameters, // dtlsParameters,
}) // })
callback() // callback()
} catch (error) { // } catch (error) {
errback(error) // errback(error)
} // }
}) // })
connectRecvTransport() // connectRecvTransport()
}) // })
} // }
btnLocalVideo.addEventListener('click', getLocalStream) btnLocalVideo.addEventListener('click', getLocalStream)
btnRecvSendTransport.addEventListener('click', consume) btnRecvSendTransport.addEventListener('click', consume)