Compare commits

..

6 Commits

Author SHA1 Message Date
0c713ed286 Added logs 2022-09-29 18:26:59 +03:00
817781085f Added logs 2022-09-29 18:23:47 +03:00
a95c29659e Added logs 2022-09-29 18:07:32 +03:00
5d451d961f Added logs 2022-09-29 17:50:51 +03:00
1d47d02792 Added logs 2022-09-29 16:42:21 +03:00
8ac58f0d9d added log for dtls transport-connect 2022-09-29 14:24:44 +03:00
8 changed files with 1023 additions and 1031 deletions

4
.env
View File

@ -1,7 +1,3 @@
PORT=3000 PORT=3000
IP=0.0.0.0 # Listening IPv4 or IPv6. IP=0.0.0.0 # Listening IPv4 or IPv6.
ANNOUNCED_IP=185.8.154.190 # Announced IPv4 or IPv6 (useful when running mediasoup behind NAT with private IP). ANNOUNCED_IP=185.8.154.190 # Announced IPv4 or IPv6 (useful when running mediasoup behind NAT with private IP).
RTC_MIN_PORT=2000
RTC_MAX_PORT=2020
SERVER_CERT="./server/ssl/cert.pem"
SERVER_KEY="./server/ssl/key.pem"

1
.gitignore vendored
View File

@ -1,2 +1 @@
/node_modules /node_modules
/dist

312
app.js
View File

@ -5,7 +5,7 @@ const app = express();
const Server = require('socket.io'); const Server = require('socket.io');
const path = require('node:path'); const path = require('node:path');
const fs = require('node:fs'); const fs = require('node:fs');
let https; let https = require('https');
try { try {
https = require('node:https'); https = require('node:https');
} catch (err) { } catch (err) {
@ -42,8 +42,8 @@ app.use('/sfu', express.static(path.join(__dirname, 'public')))
// SSL cert for HTTPS access // SSL cert for HTTPS access
const options = { const options = {
key: fs.readFileSync(process.env.SERVER_KEY, 'utf-8'), key: fs.readFileSync('./server/ssl/key.pem', 'utf-8'),
cert: fs.readFileSync(process.env.SERVER_CERT, 'utf-8'), cert: fs.readFileSync('./server/ssl/cert.pem', 'utf-8'),
} }
const httpsServer = https.createServer(options, app); const httpsServer = https.createServer(options, app);
@ -59,16 +59,16 @@ const io = new Server(httpsServer, {
// const io = new Server(server, { origins: '*:*', allowEIO3: true }); // const io = new Server(server, { origins: '*:*', allowEIO3: true });
httpsServer.listen(process.env.PORT, () => { httpsServer.listen(process.env.PORT, () => {
console.log('Video server listening on port:', process.env.PORT); console.log('Video server listening on port:', process.env.PORT)
}); })
const peers = io.of('/'); const peers = io.of('/')
const createWorker = async () => { const createWorker = async () => {
try { try {
worker = await mediasoup.createWorker({ worker = await mediasoup.createWorker({
rtcMinPort: parseInt(process.env.RTC_MIN_PORT), rtcMinPort: 2000,
rtcMaxPort: parseInt(process.env.RTC_MAX_PORT), rtcMaxPort: 2020,
}) })
console.log(`[createWorker] worker pid ${worker.pid}`); console.log(`[createWorker] worker pid ${worker.pid}`);
@ -84,87 +84,34 @@ const createWorker = async () => {
} }
// We create a Worker as soon as our application starts // We create a Worker as soon as our application starts
worker = createWorker(); worker = createWorker()
// This is an Array of RtpCapabilities // This is an Array of RtpCapabilities
// https://mediasoup.org/documentation/v3/mediasoup/rtp-parameters-and-capabilities/#RtpCodecCapability // https://mediasoup.org/documentation/v3/mediasoup/rtp-parameters-and-capabilities/#RtpCodecCapability
// list of media codecs supported by mediasoup ... // list of media codecs supported by mediasoup ...
// https://github.com/versatica/mediasoup/blob/v3/src/supportedRtpCapabilities.ts // https://github.com/versatica/mediasoup/blob/v3/src/supportedRtpCapabilities.ts
const mediaCodecs = [ const mediaCodecs = [
{ {
kind : 'audio', kind: 'audio',
mimeType : 'audio/opus', mimeType: 'audio/opus',
clockRate : 48000, clockRate: 48000,
channels : 2 channels: 2,
}, },
{ {
kind : 'video', kind: 'video',
mimeType : 'video/VP8', mimeType: 'video/VP8',
clockRate : 90000, clockRate: 90000,
parameters : parameters: {
{ 'x-google-start-bitrate': 1000,
'x-google-start-bitrate' : 1000
}, },
channels : 2
}, },
{ ]
kind : 'video',
mimeType : 'video/VP9',
clockRate : 90000,
parameters :
{
'profile-id' : 2,
'x-google-start-bitrate' : 1000
}
},
{
kind : 'video',
mimeType : 'video/h264',
clockRate : 90000,
parameters :
{
'packetization-mode' : 1,
'profile-level-id' : '4d0032',
'level-asymmetry-allowed' : 1,
'x-google-start-bitrate' : 1000
}
},
{
kind : 'video',
mimeType : 'video/h264',
clockRate : 90000,
parameters :
{
'packetization-mode' : 1,
'profile-level-id' : '42e01f',
'level-asymmetry-allowed' : 1,
'x-google-start-bitrate' : 1000
}
}
// {
// kind: 'audio',
// mimeType: 'audio/opus',
// clockRate: 48000,
// channels: 2,
// },
// {
// kind: 'video',
// mimeType: 'video/VP8',
// clockRate: 90000,
// parameters: {
// 'x-google-start-bitrate': 1000,
// },
// },
];
const closeCall = (callId) => { const closeCall = (callId) => {
try { try {
if (callId && videoCalls[callId]) { if (videoCalls[callId]) {
videoCalls[callId].producerVideo?.close(); videoCalls[callId].producer?.close();
videoCalls[callId].producerAudio?.close(); videoCalls[callId].consumer?.close();
videoCalls[callId].consumerVideo?.close();
videoCalls[callId].consumerAudio?.close();
videoCalls[callId]?.consumerTransport?.close(); videoCalls[callId]?.consumerTransport?.close();
videoCalls[callId]?.producerTransport?.close(); videoCalls[callId]?.producerTransport?.close();
videoCalls[callId]?.router?.close(); videoCalls[callId]?.router?.close();
@ -177,6 +124,16 @@ const closeCall = (callId) => {
} }
} }
const getRtpCapabilities = (callId, callback) => {
try {
console.log('[getRtpCapabilities] callId', callId);
const rtpCapabilities = videoCalls[callId].router.rtpCapabilities;
callback({ rtpCapabilities });
} catch (error) {
console.log(`ERROR | getRtpCapabilities | callId ${callId} | ${error.message}`);
}
}
/* /*
- Handlers for WS events - Handlers for WS events
- These are created only when we have a connection with a peer - These are created only when we have a connection with a peer
@ -203,9 +160,7 @@ peers.on('connection', async socket => {
- If the room already exists, it will not create it, but will only return rtpCapabilities - If the room already exists, it will not create it, but will only return rtpCapabilities
*/ */
socket.on('createRoom', async ({ callId }, callback) => { socket.on('createRoom', async ({ callId }, callback) => {
let callbackResponse = null;
try { try {
// We can continue with the room creation process only if we have a callId
if (callId) { if (callId) {
console.log(`[createRoom] socket.id ${socket.id} callId ${callId}`); console.log(`[createRoom] socket.id ${socket.id} callId ${callId}`);
if (!videoCalls[callId]) { if (!videoCalls[callId]) {
@ -214,19 +169,12 @@ peers.on('connection', async socket => {
console.log(`[createRoom] Router ID: ${videoCalls[callId].router.id}`); console.log(`[createRoom] Router ID: ${videoCalls[callId].router.id}`);
} }
socketDetails[socket.id] = callId; socketDetails[socket.id] = callId;
getRtpCapabilities(callId, callback);
// rtpCapabilities is set for callback
console.log('[getRtpCapabilities] callId', callId);
callbackResponse = {
rtpCapabilities :videoCalls[callId].router.rtpCapabilities
};
} else { } else {
console.log(`[createRoom] missing callId ${callId}`); console.log(`[createRoom] missing callId ${callId}`);
} }
} catch (error) { } catch (error) {
console.log(`ERROR | createRoom | callId ${callId} | ${error.message}`); console.log(`ERROR | createRoom | callId ${callId} | ${error.message}`);
} finally {
callback(callbackResponse);
} }
}); });
@ -247,19 +195,16 @@ peers.on('connection', async socket => {
videoCalls[callId].producerTransport = await createWebRtcTransportLayer(callId, callback); videoCalls[callId].producerTransport = await createWebRtcTransportLayer(callId, callback);
} else { } else {
console.log(`producerTransport has already been defined | callId ${callId}`); console.log(`producerTransport has already been defined | callId ${callId}`);
callback(null);
} }
} else if (!sender) { } else if (!sender) {
if (!videoCalls[callId].consumerTransport) { if (!videoCalls[callId].consumerTransport) {
videoCalls[callId].consumerTransport = await createWebRtcTransportLayer(callId, callback); videoCalls[callId].consumerTransport = await createWebRtcTransportLayer(callId, callback);
} else { } else {
console.log(`consumerTransport has already been defined | callId ${callId}`); console.log(`consumerTransport has already been defined | callId ${callId}`);
callback(null);
} }
} }
} catch (error) { } catch (error) {
console.log(`ERROR | createWebRtcTransport | callId ${socketDetails[socket.id]} | sender ${sender} | ${error.message}`); console.log(`ERROR | createWebRtcTransport | callId ${socketDetails[socket.id]} | sender ${sender} | ${error.message}`);
callback(error);
} }
}); });
@ -270,12 +215,14 @@ peers.on('connection', async socket => {
socket.on('transport-connect', async ({ dtlsParameters }) => { socket.on('transport-connect', async ({ dtlsParameters }) => {
try { try {
const callId = socketDetails[socket.id]; const callId = socketDetails[socket.id];
// console.log('🔴 typeof dtlsParameters', typeof dtlsParameters);
// console.log('🟢 dtlsParameters', JSON.parse(dtlsParameters));
// console.log('🟡 dtlsParameters', dtlsParameters);
if (typeof dtlsParameters === 'string') dtlsParameters = JSON.parse(dtlsParameters); if (typeof dtlsParameters === 'string') dtlsParameters = JSON.parse(dtlsParameters);
console.log(`[transport-connect] socket.id ${socket.id} | callId ${callId}`); console.log(`[transport-connect] socket.id ${socket.id} | callId ${callId}`);
await videoCalls[callId].producerTransport.connect({ dtlsParameters }); await videoCalls[callId].producerTransport.connect({ dtlsParameters });
} catch (error) { } catch (error) {
console.log(`ERROR | transport-connect | callId ${socketDetails[socket.id]} | ${error.message}`); console.log(`ERROR | transport-connect | callId ${socketDetails[socket.id]} | ${error.stack}`);
} }
}); });
@ -283,54 +230,22 @@ peers.on('connection', async socket => {
- The event sent by the client (PRODUCER) after successfully connecting to producerTransport - The event sent by the client (PRODUCER) after successfully connecting to producerTransport
- For the router with the id callId, we make produce on producerTransport - For the router with the id callId, we make produce on producerTransport
- Create the handler on producer at the 'transportclose' event - Create the handler on producer at the 'transportclose' event
*/ */
socket.on('transport-produce', async ({ kind, rtpParameters, appData }, callback) => { socket.on('transport-produce', async ({ kind, rtpParameters, appData }) => {
try { try {
const callId = socketDetails[socket.id]; const callId = socketDetails[socket.id];
if (typeof rtpParameters === 'string') rtpParameters = JSON.parse(rtpParameters); console.log('[transport-produce] | socket.id', socket.id, '| callId', callId);
videoCalls[callId].producer = await videoCalls[callId].producerTransport.produce({
console.log(`[transport-produce] kind: ${kind} | socket.id: ${socket.id} | callId: ${callId}`); kind,
console.log('kind', kind); rtpParameters,
console.log('rtpParameters', rtpParameters); });
console.log(`[transport-produce] Producer ID: ${videoCalls[callId].producer.id} | kind: ${videoCalls[callId].producer.kind}`);
if (kind === 'video') {
videoCalls[callId].producerVideo = await videoCalls[callId].producerTransport.produce({ videoCalls[callId].producer.on('transportclose', () => {
kind, const callId = socketDetails[socket.id];
rtpParameters, console.log('transport for this producer closed', callId)
}); closeCall(callId);
});
console.log(`[transport-produce] Producer ID: ${videoCalls[callId].producerVideo.id} | kind: ${videoCalls[callId].producerVideo.kind}`);
videoCalls[callId].producerVideo.on('transportclose', () => {
const callId = socketDetails[socket.id];
console.log('transport for this producer closed', callId)
closeCall(callId);
});
// Send back to the client the Producer's id
callback && callback({
id: videoCalls[callId].producerVideo.id
});
} else if (kind === 'audio') {
videoCalls[callId].producerAudio = await videoCalls[callId].producerTransport.produce({
kind,
rtpParameters,
});
console.log(`[transport-produce] Producer ID: ${videoCalls[callId].producerAudio.id} | kind: ${videoCalls[callId].producerAudio.kind}`);
videoCalls[callId].producerAudio.on('transportclose', () => {
const callId = socketDetails[socket.id];
console.log('transport for this producer closed', callId)
closeCall(callId);
});
// Send back to the client the Producer's id
callback && callback({
id: videoCalls[callId].producerAudio.id
});
}
} catch (error) { } catch (error) {
console.log(`ERROR | transport-produce | callId ${socketDetails[socket.id]} | ${error.message}`); console.log(`ERROR | transport-produce | callId ${socketDetails[socket.id]} | ${error.message}`);
} }
@ -359,37 +274,48 @@ peers.on('connection', async socket => {
*/ */
socket.on('consume', async ({ rtpCapabilities }, callback) => { socket.on('consume', async ({ rtpCapabilities }, callback) => {
try { try {
console.log(`[consume] rtpCapabilities: ${JSON.stringify(rtpCapabilities)}`);
const callId = socketDetails[socket.id]; const callId = socketDetails[socket.id];
console.log('[consume] callId', callId); console.log('[consume] callId', callId);
const canConsumeVideo = !!videoCalls[callId].producerVideo && !!videoCalls[callId].router.canConsume({ // Check if the router can consume the specified producer
producerId: videoCalls[callId].producerVideo.id, if (videoCalls[callId].router.canConsume({
producerId: videoCalls[callId].producer.id,
rtpCapabilities rtpCapabilities
}) })) {
console.log('[consume] Can consume', callId);
// Transport can now consume and return a consumer
videoCalls[callId].consumer = await videoCalls[callId].consumerTransport.consume({
producerId: videoCalls[callId].producer.id,
rtpCapabilities,
paused: true,
});
const canConsumeAudio = !!videoCalls[callId].producerAudio && !!videoCalls[callId].router.canConsume({ // https://mediasoup.org/documentation/v3/mediasoup/api/#consumer-on-transportclose
producerId: videoCalls[callId].producerAudio.id, videoCalls[callId].consumer.on('transportclose', () => {
rtpCapabilities const callId = socketDetails[socket.id];
}) console.log('transport close from consumer', callId);
closeCall();
});
console.log('[consume] canConsumeVideo', canConsumeVideo); // https://mediasoup.org/documentation/v3/mediasoup/api/#consumer-on-producerclose
console.log('[consume] canConsumeAudio', canConsumeAudio); videoCalls[callId].consumer.on('producerclose', () => {
const callId = socketDetails[socket.id];
console.log('producer of consumer closed', callId);
closeCall();
});
if (canConsumeVideo && !canConsumeAudio) { // From the consumer extract the following params to send back to the Client
console.log('1'); const params = {
const videoParams = await consumeVideo(callId, rtpCapabilities) id: videoCalls[callId].consumer.id,
console.log('videoParams', videoParams); producerId: videoCalls[callId].producer.id,
callback({ videoParams, audioParams: null }); kind: videoCalls[callId].consumer.kind,
} else if (canConsumeVideo && canConsumeAudio) { rtpParameters: videoCalls[callId].consumer.rtpParameters,
console.log('2'); };
const videoParams = await consumeVideo(callId, rtpCapabilities)
const audioParams = await consumeAudio(callId, rtpCapabilities) // Send the parameters to the client
callback({ videoParams, audioParams }); callback({ params });
} else { } else {
console.log(`[consume] Can't consume | callId ${callId}`); console.log(`[canConsume] Can't consume | callId ${callId}`);
callback(null);
} }
} catch (error) { } catch (error) {
console.log(`ERROR | consume | callId ${socketDetails[socket.id]} | ${error.message}`) console.log(`ERROR | consume | callId ${socketDetails[socket.id]} | ${error.message}`)
@ -405,71 +331,13 @@ peers.on('connection', async socket => {
try { try {
const callId = socketDetails[socket.id]; const callId = socketDetails[socket.id];
console.log(`[consumer-resume] callId ${callId}`) console.log(`[consumer-resume] callId ${callId}`)
await videoCalls[callId].consumerVideo.resume(); await videoCalls[callId].consumer.resume();
await videoCalls[callId].consumerAudio.resume();
} catch (error) { } catch (error) {
console.log(`ERROR | consumer-resume | callId ${socketDetails[socket.id]} | ${error.message}`); console.log(`ERROR | consumer-resume | callId ${socketDetails[socket.id]} | ${error.message}`);
} }
}); });
}); });
const consumeVideo = async (callId, rtpCapabilities) => {
videoCalls[callId].consumerVideo = await videoCalls[callId].consumerTransport.consume({
producerId: videoCalls[callId].producerVideo.id,
rtpCapabilities,
paused: true,
});
// https://mediasoup.org/documentation/v3/mediasoup/api/#consumer-on-transportclose
videoCalls[callId].consumerVideo.on('transportclose', () => {
const callId = socketDetails[socket.id];
console.log('transport close from consumer', callId);
closeCall(callId);
});
// https://mediasoup.org/documentation/v3/mediasoup/api/#consumer-on-producerclose
videoCalls[callId].consumerVideo.on('producerclose', () => {
const callId = socketDetails[socket.id];
console.log('producer of consumer closed', callId);
closeCall(callId);
});
return {
id: videoCalls[callId].consumerVideo.id,
producerId: videoCalls[callId].producerVideo.id,
kind: 'video',
rtpParameters: videoCalls[callId].consumerVideo.rtpParameters,
}
}
const consumeAudio = async (callId, rtpCapabilities) => {
videoCalls[callId].consumerAudio = await videoCalls[callId].consumerTransport.consume({
producerId: videoCalls[callId].producerAudio.id,
rtpCapabilities,
paused: true,
});
// https://mediasoup.org/documentation/v3/mediasoup/api/#consumer-on-transportclose
videoCalls[callId].consumerAudio.on('transportclose', () => {
const callId = socketDetails[socket.id];
console.log('transport close from consumer', callId);
closeCall(callId);
});
// https://mediasoup.org/documentation/v3/mediasoup/api/#consumer-on-producerclose
videoCalls[callId].consumerAudio.on('producerclose', () => {
const callId = socketDetails[socket.id];
console.log('producer of consumer closed', callId);
closeCall(callId);
});
return {
id: videoCalls[callId].consumerAudio.id,
producerId: videoCalls[callId].producerAudio.id,
kind: 'audio',
rtpParameters: videoCalls[callId].consumerAudio.rtpParameters,
}
}
/* /*
- Called from at event 'createWebRtcTransport' and assigned to the consumer or producer transport - Called from at event 'createWebRtcTransport' and assigned to the consumer or producer transport
- It will return parameters, these are required for the client to create the RecvTransport - It will return parameters, these are required for the client to create the RecvTransport
@ -517,7 +385,7 @@ const createWebRtcTransportLayer = async (callId, callback) => {
dtlsParameters: transport.dtlsParameters, dtlsParameters: transport.dtlsParameters,
}; };
console.log('[createWebRtcTransportLayer] callback params', params); console.log(`createWebRtcTransportLayer | params.dtlsParameters ${params.dtlsParameters}`);
// Send back to the client the params // Send back to the client the params
callback({ params }); callback({ params });

View File

@ -1,48 +0,0 @@
#/!bin/bash
## PREBUILD PROCESS
# check dist dir to be present and empty
if [ ! -d "dist" ]; then
## MAKE DIR
mkdir "dist"
echo "Directory dist created."
else
## CLEANUP
rm -fr dist/*
fi
# Install dependencies
#npm install
## PROJECT NEEDS
echo "Building app... from $(git rev-parse --abbrev-ref HEAD)"
#npm run-script build
cp -r {.env,app.js,package.json,server,public} dist/
#Add version control for pm2
cd dist
#Add version control for pm2
version=$(git describe)
file_pkg="package.json"
key=" \"version\": \""
count=$(echo ${version%%-*} | grep -o "\." | wc -l)
if (( $count > 1 )); then
version=${version%%-*}
else
version="${version%%-*}.0"
fi
if [ -f "$file_pkg" ] && [ ! -z "$version" ]; then
version=" \"version\": \"$version\","
sed -i "s|^.*$key.*|${version//\//\\/}|g" $file_pkg
text=$(cat $file_pkg | grep -c "$version")
if [ $text -eq 0 ]; then
echo "Version couldn't be set"
else
echo "Version $version successfully applied to App"
fi
fi
## POST BUILD
cd -

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,5 @@
module.exports = { module.exports = {
hubAddress: 'https://hub.dev.linx.safemobile.com/', hubAddress: 'https://hub.dev.linx.safemobile.com/',
mediasoupAddress: 'https://video.safemobile.org', mediasoupAddress: 'https://video.safemobile.org/mediasoup',
// mediasoupAddress: 'http://localhost:3000/mediasoup',
} }

View File

@ -43,7 +43,7 @@
<tr> <tr>
<td> <td>
<div id="sharedBtns"> <div id="sharedBtns">
<video id="localVideo" autoplay class="video" muted></video> <video id="localVideo" autoplay class="video" ></video>
</div> </div>
</td> </td>
<td> <td>

View File

@ -12,182 +12,145 @@ let callId = parseInt(urlParams.get('callId')) || null;
const IS_PRODUCER = urlParams.get('producer') === 'true' ? true : false const IS_PRODUCER = urlParams.get('producer') === 'true' ? true : false
console.log('[URL] ASSET_ID', ASSET_ID, '| ACCOUNT_ID', ACCOUNT_ID, '| callId', callId, ' | IS_PRODUCER', IS_PRODUCER) console.log('[URL] ASSET_ID', ASSET_ID, '| ACCOUNT_ID', ACCOUNT_ID, '| callId', callId, ' | IS_PRODUCER', IS_PRODUCER)
console.log('🟩 config', config) let socket
hub = io(config.hubAddress)
const connectToMediasoup = () => {
socket = io(config.mediasoupAddress, {
reconnection: true,
reconnectionDelay: 1000,
reconnectionDelayMax : 5000,
reconnectionAttempts: Infinity
})
socket.on('connection-success', ({ _socketId, existsProducer }) => {
console.log(`[MEDIA] ${config.mediasoupAddress} | connected: ${socket.connected} | existsProducer: ${existsProducer}`)
if (!IS_PRODUCER && existsProducer && consumer === undefined) {
goConnect()
// document.getElementById('btnRecvSendTransport').click();
}
if (IS_PRODUCER && urlParams.get('testing') === 'true') { getLocalStream() }
})
}
if (IS_PRODUCER === true) {
hub.on('connect', async () => {
console.log(`[HUB] ${config.hubAddress} | connected: ${hub.connected}`)
connectToMediasoup()
hub.emit(
'ars',
JSON.stringify({
ars: true,
asset_id: ASSET_ID,
account_id: ACCOUNT_ID,
})
)
hub.on('video', (data) => {
const parsedData = JSON.parse(data);
if (parsedData.type === 'notify-request') {
console.log('video', parsedData)
originAssetId = parsedData.origin_asset_id;
// originAssetName = parsedData.origin_asset_name;
// originAssetTypeName = parsedData.origin_asset_type_name;
callId = parsedData.video_call_id;
console.log('[VIDEO] notify-request | IS_PRODUCER', IS_PRODUCER, 'callId', callId);
getLocalStream()
}
if (parsedData.type === 'notify-end') {
console.log('[VIDEO] notify-end | IS_PRODUCER', IS_PRODUCER, 'callId', callId);
resetCallSettings()
}
})
})
hub.on('connect_error', (error) => {
console.log('connect_error', error);
});
hub.on('connection', () => {
console.log('connection')
})
hub.on('disconnect', () => {
console.log('disconnect')
})
} else {
connectToMediasoup()
}
let socket, hub
let doIHaveAudio = false
let device let device
let rtpCapabilities let rtpCapabilities
let producerTransport let producerTransport
let consumerTransport let consumerTransport
let producerVideo let producer
let producerAudio
let consumer let consumer
let originAssetId let originAssetId
// let originAssetName = 'Adi'
// let originAssetTypeName = 'linx'
// https://mediasoup.org/documentation/v3/mediasoup-client/api/#ProducerOptions // https://mediasoup.org/documentation/v3/mediasoup-client/api/#ProducerOptions
// https://mediasoup.org/documentation/v3/mediasoup-client/api/#transport-produce // https://mediasoup.org/documentation/v3/mediasoup-client/api/#transport-produce
let videoParams = { let params = {
// mediasoup params
encodings: [ encodings: [
{ scaleResolutionDownBy: 4, maxBitrate: 500000 }, {
{ scaleResolutionDownBy: 2, maxBitrate: 1000000 }, rid: 'r0',
{ scaleResolutionDownBy: 1, maxBitrate: 5000000 }, maxBitrate: 100000,
{ scalabilityMode: 'S3T3_KEY' } scalabilityMode: 'S1T3',
},
{
rid: 'r1',
maxBitrate: 300000,
scalabilityMode: 'S1T3',
},
{
rid: 'r2',
maxBitrate: 900000,
scalabilityMode: 'S1T3',
},
], ],
// https://mediasoup.org/documentation/v3/mediasoup-client/api/#ProducerCodecOptions
codecOptions: { codecOptions: {
videoGoogleStartBitrate: 1000 videoGoogleStartBitrate: 1000
} }
} }
let audioParams = {
codecOptions :
{
opusStereo : true,
opusDtx : true
}
}
setTimeout(() => {
hub = io(config.hubAddress)
const connectToMediasoup = () => {
socket = io(config.mediasoupAddress, {
reconnection: true,
reconnectionDelay: 1000,
reconnectionDelayMax : 5000,
reconnectionAttempts: Infinity
})
socket.on('connection-success', ({ _socketId, existsProducer }) => {
console.log(`[MEDIA] ${config.mediasoupAddress} | connected: ${socket.connected} | existsProducer: ${existsProducer}`)
if (!IS_PRODUCER && existsProducer && consumer === undefined) {
goConnect()
// document.getElementById('btnRecvSendTransport').click();
}
if (IS_PRODUCER && urlParams.get('testing') === 'true') { getLocalStream() }
})
}
if (IS_PRODUCER === true) {
hub.on('connect', async () => {
console.log(`[HUB]! ${config.hubAddress} | connected: ${hub.connected}`)
connectToMediasoup()
hub.emit(
'ars',
JSON.stringify({
ars: true,
asset_id: ASSET_ID,
account_id: ACCOUNT_ID,
})
)
hub.on('video', (data) => {
const parsedData = JSON.parse(data);
if (parsedData.type === 'notify-request') {
console.log('video', parsedData)
originAssetId = parsedData.origin_asset_id;
// originAssetName = parsedData.origin_asset_name;
// originAssetTypeName = parsedData.origin_asset_type_name;
callId = parsedData.video_call_id;
console.log('[VIDEO] notify-request | IS_PRODUCER', IS_PRODUCER, 'callId', callId);
getLocalStream()
}
if (parsedData.type === 'notify-end') {
console.log('[VIDEO] notify-end | IS_PRODUCER', IS_PRODUCER, 'callId', callId);
resetCallSettings()
}
})
})
hub.on('connect_error', (error) => {
console.log('connect_error', error);
});
hub.on('connection', () => {
console.log('connection')
})
hub.on('disconnect', () => {
console.log('disconnect')
})
} else {
connectToMediasoup()
}
}, 1600);
const streamSuccess = (stream) => { const streamSuccess = (stream) => {
console.log('[streamSuccess] device', device); console.log('[streamSuccess]');
localVideo.srcObject = stream localVideo.srcObject = stream
console.log('stream', stream); const track = stream.getVideoTracks()[0]
const videoTrack = stream.getVideoTracks()[0] params = {
const audioTrack = stream.getAudioTracks()[0] track,
...params
videoParams = {
track: videoTrack,
// codec : device.rtpCapabilities.codecs.find((codec) => codec.mimeType.toLowerCase() === 'video/vp9'),
// codec : 'video/vp9',
...videoParams
} }
audioParams = {
track: audioTrack,
...audioParams
}
console.log('[streamSuccess] videoParams', videoParams, ' | audioParams', audioParams);
goConnect() goConnect()
// console.log('[streamSuccess]');
// localVideo.srcObject = stream
// const track = stream.getVideoTracks()[0]
// videoParams = {
// track,
// ...videoParams
// }
// goConnect()
} }
const getLocalStream = () => { const getLocalStream = () => {
console.log('[getLocalStream]'); console.log('[getLocalStream]');
navigator.mediaDevices.getUserMedia({ navigator.mediaDevices.getUserMedia({
audio: true, audio: false,
video: { video: {
qvga : { width: { ideal: 320 }, height: { ideal: 240 } }, width: {
vga : { width: { ideal: 640 }, height: { ideal: 480 } }, min: 640,
hd : { width: { ideal: 1280 }, height: { ideal: 720 } } max: 1920,
},
height: {
min: 400,
max: 1080,
}
} }
}) })
.then(streamSuccess) .then(streamSuccess)
.catch(error => { .catch(error => {
console.log(error.message) console.log(error.message)
}) })
navigator.permissions.query(
{ name: 'microphone' }
).then(function(permissionStatus) {
console.log('🟨 [PERMISSION] onchange1', permissionStatus.state); // granted, denied, prompt
// If he has entered before, the saved access is already saved
if (permissionStatus === 'grated') {
doIHaveAudio = true;
}
// If it is the first time client enter and give permission
permissionStatus.onchange = function() {
console.log('🟨 [PERMISSION] onchange2', this.state);
if (this.state === 'grated') {
// doIHaveAudio = true;
}
}
})
} }
const goConnect = () => { const goConnect = () => {
@ -204,7 +167,7 @@ const goCreateTransport = () => {
// server side to send/recive media // server side to send/recive media
const createDevice = async () => { const createDevice = async () => {
try { try {
console.log('[createDevice] 1 device', device); console.log('[createDevice]');
device = new mediasoupClient.Device() device = new mediasoupClient.Device()
// https://mediasoup.org/documentation/v3/mediasoup-client/api/#device-load // https://mediasoup.org/documentation/v3/mediasoup-client/api/#device-load
@ -215,8 +178,7 @@ const createDevice = async () => {
}) })
console.log('Device RTP Capabilities', device.rtpCapabilities) console.log('Device RTP Capabilities', device.rtpCapabilities)
console.log('[createDevice] 2 device', device);
// once the device loads, create transport // once the device loads, create transport
goCreateTransport() goCreateTransport()
@ -245,20 +207,18 @@ const getRtpCapabilities = () => {
} }
const createSendTransport = () => { const createSendTransport = () => {
console.log('[createSendTransport');
// see server's socket.on('createWebRtcTransport', sender?, ...) // see server's socket.on('createWebRtcTransport', sender?, ...)
// this is a call from Producer, so sender = true // this is a call from Producer, so sender = true
socket.emit('createWebRtcTransport', { sender: true, callId }, (value) => { socket.emit('createWebRtcTransport', { sender: true, callId }, ({ params }) => {
console.log(`[createWebRtcTransport] value: ${JSON.stringify(value)}`);
const params = value.params;
// The server sends back params needed // The server sends back params needed
// to create Send Transport on the client side // to create Send Transport on the client side
if (params.error) { if (params.error) {
console.log(params.error) console.log(params.error)
return return
} }
console.log(params)
// creates a new WebRTC Transport to send media // creates a new WebRTC Transport to send media
// based on the server's producer transport params // based on the server's producer transport params
// https://mediasoup.org/documentation/v3/mediasoup-client/api/#TransportOptions // https://mediasoup.org/documentation/v3/mediasoup-client/api/#TransportOptions
@ -284,7 +244,7 @@ const createSendTransport = () => {
}) })
producerTransport.on('produce', async (parameters, callback, errback) => { producerTransport.on('produce', async (parameters, callback, errback) => {
console.log('[produce] parameters', parameters) console.log(parameters)
try { try {
// tell the server to create a Producer // tell the server to create a Producer
@ -310,42 +270,21 @@ const createSendTransport = () => {
} }
const connectSendTransport = async () => { const connectSendTransport = async () => {
console.log('[connectSendTransport] producerTransport');
// we now call produce() to instruct the producer transport // we now call produce() to instruct the producer transport
// to send media to the Router // to send media to the Router
// https://mediasoup.org/documentation/v3/mediasoup-client/api/#transport-produce // https://mediasoup.org/documentation/v3/mediasoup-client/api/#transport-produce
// this action will trigger the 'connect' and 'produce' events above // this action will trigger the 'connect' and 'produce' events above
producer = await producerTransport.produce(params)
console.log('videoParams', videoParams);
producerVideo = await producerTransport.produce(videoParams) producer.on('trackended', () => {
console.log('producerVideo', producerVideo);
producerVideo.on('trackended', () => {
console.log('track ended') console.log('track ended')
// close video track // close video track
}) })
producerVideo.on('transportclose', () => { producer.on('transportclose', () => {
console.log('transport ended') console.log('transport ended')
// close video track // close video track
}) })
// Video is mandatory, but audio may not be included
// if (doIHaveAudio) {
console.log('audioParams', audioParams);
producerAudio = await producerTransport.produce(audioParams)
console.log('producerAudio', producerAudio);
producerAudio.on('trackended', () => {
console.log('track ended')
// close video track
})
producerAudio.on('transportclose', () => {
console.log('transport ended')
// close video track
})
// }
const answer = { const answer = {
origin_asset_id: ASSET_ID, origin_asset_id: ASSET_ID,
@ -381,7 +320,7 @@ const createRecvTransport = async () => {
return return
} }
console.log('[createRecvTransport] params', params) console.log(params)
// creates a new WebRTC Transport to receive media // creates a new WebRTC Transport to receive media
// based on server's consumer transport params // based on server's consumer transport params
@ -414,8 +353,7 @@ const resetCallSettings = () => {
localVideo.srcObject = null localVideo.srcObject = null
remoteVideo.srcObject = null remoteVideo.srcObject = null
consumer = null consumer = null
producerVideo = null producer = null
producerAudio = null
producerTransport = null producerTransport = null
consumerTransport = null consumerTransport = null
device = undefined device = undefined
@ -478,7 +416,6 @@ const closeCall = () => {
resetCallSettings() resetCallSettings()
} }
btnLocalVideo.addEventListener('click', getLocalStream) btnLocalVideo.addEventListener('click', getLocalStream)
btnRecvSendTransport.addEventListener('click', goConnect) btnRecvSendTransport.addEventListener('click', goConnect)
btnCloseCall.addEventListener('click', closeCall) btnCloseCall.addEventListener('click', closeCall)