Compare commits
21 Commits
add-diagra
...
e9ff060544
Author | SHA1 | Date | |
---|---|---|---|
e9ff060544 | |||
7d677f4a34 | |||
8f96b8c98b | |||
1084a808c7 | |||
3838f774bf | |||
06bb275f0d | |||
a05f7cc987 | |||
c5c8bc5bb3 | |||
d6bc4e51e5 | |||
4ae02f70d6 | |||
d593d6dc83 | |||
1a1fa9450e | |||
0d24604f2a | |||
1d7c994036 | |||
bc2bf24a65 | |||
cdbfc7891d | |||
c730341674 | |||
b621b76e37 | |||
39ad9cad27 | |||
8860423e21 | |||
9179a67f64 |
1120
public/bundle.js
1120
public/bundle.js
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,4 @@
|
|||||||
module.exports = {
|
module.exports = {
|
||||||
hubAddress: 'https://hub.dev.linx.safemobile.com/',
|
hubAddress: 'https://hub.dev.linx.safemobile.com/',
|
||||||
mediasoupAddress: 'https://video.safemobile.org/mediasoup',
|
mediasoupAddress: 'https://video.safemobile.org',
|
||||||
// mediasoupAddress: 'http://localhost:3000/mediasoup',
|
|
||||||
}
|
}
|
200
public/index.js
200
public/index.js
@ -12,83 +12,91 @@ 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)
|
||||||
|
|
||||||
let socket
|
console.log('🟩 config', config)
|
||||||
hub = io(config.hubAddress)
|
|
||||||
|
|
||||||
const connectToMediasoup = () => {
|
let socket, hub
|
||||||
|
|
||||||
socket = io(config.mediasoupAddress, {
|
setTimeout(() => {
|
||||||
reconnection: true,
|
hub = io(config.hubAddress)
|
||||||
reconnectionDelay: 1000,
|
|
||||||
reconnectionDelayMax : 5000,
|
|
||||||
reconnectionAttempts: Infinity
|
|
||||||
})
|
|
||||||
|
|
||||||
socket.on('connection-success', ({ _socketId, existsProducer }) => {
|
const connectToMediasoup = () => {
|
||||||
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) {
|
socket = io(config.mediasoupAddress, {
|
||||||
hub.on('connect', async () => {
|
reconnection: true,
|
||||||
console.log(`[HUB] ${config.hubAddress} | connected: ${hub.connected}`)
|
reconnectionDelay: 1000,
|
||||||
connectToMediasoup()
|
reconnectionDelayMax : 5000,
|
||||||
|
reconnectionAttempts: Infinity
|
||||||
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) => {
|
socket.on('connection-success', ({ _socketId, existsProducer }) => {
|
||||||
console.log('connect_error', error);
|
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() }
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
hub.on('connection', () => {
|
if (IS_PRODUCER === true) {
|
||||||
console.log('connection')
|
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()
|
||||||
|
}
|
||||||
|
|
||||||
|
}, 2000);
|
||||||
|
|
||||||
hub.on('disconnect', () => {
|
|
||||||
console.log('disconnect')
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
connectToMediasoup()
|
|
||||||
}
|
|
||||||
|
|
||||||
let device
|
let device
|
||||||
let rtpCapabilities
|
let rtpCapabilities
|
||||||
let producerTransport
|
let producerTransport
|
||||||
let consumerTransport
|
let consumerTransport
|
||||||
let producer
|
let producerVideo
|
||||||
|
let producerAudio
|
||||||
let consumer
|
let consumer
|
||||||
let originAssetId
|
let originAssetId
|
||||||
// let originAssetName = 'Adi'
|
// let originAssetName = 'Adi'
|
||||||
@ -96,21 +104,18 @@ let originAssetId
|
|||||||
|
|
||||||
// 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 params = {
|
let videoParams = {
|
||||||
// mediasoup params
|
// mediasoup params
|
||||||
encodings: [
|
encodings: [
|
||||||
{
|
{
|
||||||
rid: 'r0',
|
|
||||||
maxBitrate: 100000,
|
maxBitrate: 100000,
|
||||||
scalabilityMode: 'S1T3',
|
scalabilityMode: 'S1T3',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
rid: 'r1',
|
|
||||||
maxBitrate: 300000,
|
maxBitrate: 300000,
|
||||||
scalabilityMode: 'S1T3',
|
scalabilityMode: 'S1T3',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
rid: 'r2',
|
|
||||||
maxBitrate: 900000,
|
maxBitrate: 900000,
|
||||||
scalabilityMode: 'S1T3',
|
scalabilityMode: 'S1T3',
|
||||||
},
|
},
|
||||||
@ -121,21 +126,51 @@ let params = {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const streamSuccess = (stream) => {
|
let audioParams = {
|
||||||
console.log('[streamSuccess]');
|
// mediasoup params
|
||||||
localVideo.srcObject = stream
|
encodings: [
|
||||||
const track = stream.getVideoTracks()[0]
|
{
|
||||||
params = {
|
maxBitrate: 100000,
|
||||||
track,
|
scalabilityMode: 'S1T3',
|
||||||
...params
|
},
|
||||||
|
{
|
||||||
|
maxBitrate: 300000,
|
||||||
|
scalabilityMode: 'S1T3',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
maxBitrate: 900000,
|
||||||
|
scalabilityMode: 'S1T3',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
codecOptions: {
|
||||||
|
opusStereo: true
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const streamSuccess = (stream) => {
|
||||||
|
localVideo.srcObject = stream
|
||||||
|
console.log('stream', stream);
|
||||||
|
const videoTrack = stream.getVideoTracks()[0]
|
||||||
|
const audioTrack = stream.getAudioTracks()[0]
|
||||||
|
|
||||||
|
videoParams = {
|
||||||
|
track: videoTrack,
|
||||||
|
...videoParams
|
||||||
|
}
|
||||||
|
|
||||||
|
audioParams = {
|
||||||
|
track: audioTrack,
|
||||||
|
...audioParams
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('[streamSuccess] videoParams', videoParams, ' | audioParams', audioParams);
|
||||||
goConnect()
|
goConnect()
|
||||||
}
|
}
|
||||||
|
|
||||||
const getLocalStream = () => {
|
const getLocalStream = () => {
|
||||||
console.log('[getLocalStream]');
|
console.log('[getLocalStream]');
|
||||||
navigator.mediaDevices.getUserMedia({
|
navigator.mediaDevices.getUserMedia({
|
||||||
audio: false,
|
audio: true,
|
||||||
video: {
|
video: {
|
||||||
width: {
|
width: {
|
||||||
min: 640,
|
min: 640,
|
||||||
@ -244,7 +279,7 @@ const createSendTransport = () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
producerTransport.on('produce', async (parameters, callback, errback) => {
|
producerTransport.on('produce', async (parameters, callback, errback) => {
|
||||||
console.log(parameters)
|
console.log('[produce] parameters', parameters)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// tell the server to create a Producer
|
// tell the server to create a Producer
|
||||||
@ -270,18 +305,21 @@ const createSendTransport = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const connectSendTransport = async () => {
|
const connectSendTransport = async () => {
|
||||||
|
|
||||||
|
console.log('[connectSendTransport] producerTransport', params);
|
||||||
|
|
||||||
// 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)
|
producerVideo = await producerTransport.produce(videoParams)
|
||||||
|
|
||||||
producer.on('trackended', () => {
|
producerVideo.on('trackended', () => {
|
||||||
console.log('track ended')
|
console.log('track ended')
|
||||||
// close video track
|
// close video track
|
||||||
})
|
})
|
||||||
|
|
||||||
producer.on('transportclose', () => {
|
producerVideo.on('transportclose', () => {
|
||||||
console.log('transport ended')
|
console.log('transport ended')
|
||||||
// close video track
|
// close video track
|
||||||
})
|
})
|
||||||
@ -353,7 +391,7 @@ const resetCallSettings = () => {
|
|||||||
localVideo.srcObject = null
|
localVideo.srcObject = null
|
||||||
remoteVideo.srcObject = null
|
remoteVideo.srcObject = null
|
||||||
consumer = null
|
consumer = null
|
||||||
producer = null
|
producerVideo = null
|
||||||
producerTransport = null
|
producerTransport = null
|
||||||
consumerTransport = null
|
consumerTransport = null
|
||||||
device = undefined
|
device = undefined
|
||||||
|
Reference in New Issue
Block a user