Update server

README.md

@@ -22,20 +22,18 @@
 2. Run the `npm start:prod` command to start the server in production mode.
 (To connect to the terminal, use `pm2 log video-server`)
 
-
+---
-### Web client
 
 - The server will start by default on port 3000, and the ssl certificates will have to be configured
 - The web client can be accessed using the /sfu path
-ex: https://HOST/sfu/?assetId=1&&accountId=1&producer=true&dest_asset_id=75&assetName=Adi
+ex: http://localhost:3000/sfu/?assetId=1&&accountId=1&producer=true&assetName=Adi&assetType=linx
 assetId = asset id of the unit on which you are doing the test
 accountId = account id of the unit on which you are doing the test
 producer = it will always be true because you are the producer
 (it's possible to put false, but then you have to have another client with producer true)
 assetName = asset name of the unit on which you are doing the test
-dest_asset_id= the addressee with whom the call is made
+assetType = asset type of the unit on which you are doing the test
-- To make a call using this client, you need a microphone and permission to use it
-- For any changes related to the client, the command `npm run watch' will have to be used to generate the bundle.js used by the web client
 
 ### Demo project
   The demo project used initially and then modified for our needs `https://github.com/jamalag/mediasoup2`
+

build.sh

@@ -44,3 +44,5 @@ fi
 ## POST BUILD
 
 cd -
+
+

public/bundle.js

@@ -20373,6 +20373,7 @@ console.log('[URL] ASSET_ID', ASSET_ID, '| ACCOUNT_ID', ACCOUNT_ID, '| callId',
 console.log('🟩 config', config)
 
 let socket, hub
+let doIHaveAudio = false
 let device
 let rtpCapabilities
 let producerTransport
@@ -20487,6 +20488,8 @@ const streamSuccess = (stream) => {
 
   videoParams = {
     track: videoTrack,
+    // codec : device.rtpCapabilities.codecs.find((codec) => codec.mimeType.toLowerCase() === 'video/vp9'),
+    // codec : 'video/vp9',
     ...videoParams
   }
 
@@ -20497,6 +20500,14 @@ const streamSuccess = (stream) => {
 
   console.log('[streamSuccess] videoParams', videoParams, ' | audioParams', audioParams);
   goConnect()
+  // console.log('[streamSuccess]');
+  // localVideo.srcObject = stream
+  // const track = stream.getVideoTracks()[0]
+  // videoParams = {
+  //   track,
+  //   ...videoParams
+  // }
+  // goConnect()
 }
 
 const getLocalStream = () => {
@@ -20516,9 +20527,23 @@ const getLocalStream = () => {
 
   navigator.permissions.query(
     { name: 'microphone' }
-  ).then((permissionStatus) =>{
+  ).then(function(permissionStatus) {
-    console.log('🟨 [PERMISSION] permissionStatus', permissionStatus); // granted, denied, prompt
+
-    // It will block the code from execution and display "Permission denied" if we don't have microphone permissions
+    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;
+      }
+    }
+
   })
 
 }
@@ -20537,6 +20562,7 @@ const goCreateTransport = () => {
 // server side to send/recive media
 const createDevice = async () => {
   try {
+    console.log('[createDevice] 1 device', device);
     device = new mediasoupClient.Device()
 
     // https://mediasoup.org/documentation/v3/mediasoup-client/api/#device-load
@@ -20547,7 +20573,7 @@ const createDevice = async () => {
     })
 
     console.log('Device RTP Capabilities', device.rtpCapabilities)
-    console.log('[createDevice] device', device);
+    console.log('[createDevice] 2 device', device);
     
     // once the device loads, create transport
     goCreateTransport()
@@ -20619,7 +20645,7 @@ const createSendTransport = () => {
       console.log('[produce] parameters', parameters)
 
       try {
-        // Tell the server to create a Producer
+        // tell the server to create a Producer
         // with the following parameters and produce
         // and expect back a server side producer id
         // see server's socket.on('transport-produce', ...)
@@ -20645,16 +20671,14 @@ 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
   // https://mediasoup.org/documentation/v3/mediasoup-client/api/#transport-produce
   // this action will trigger the 'connect' and 'produce' events above
   
-  // Produce video
-  producerVideo = await producerTransport.produce(videoParams)
   console.log('videoParams', videoParams);
+  producerVideo = await producerTransport.produce(videoParams)
   console.log('producerVideo', producerVideo);
-
   producerVideo.on('trackended', () => {
     console.log('track ended')
     // close video track
@@ -20665,20 +20689,21 @@ const connectSendTransport = async () => {
     // close video track
   })    
   
-  // Produce audio
+  // Video is mandatory, but audio may not be included
-  producerAudio = await producerTransport.produce(audioParams)
+  // if (doIHaveAudio) {
-  console.log('audioParams', audioParams);
+    console.log('audioParams', audioParams);
-  console.log('producerAudio', producerAudio);
+    producerAudio = await producerTransport.produce(audioParams)
+    console.log('producerAudio', producerAudio);
+    producerAudio.on('trackended', () => {
+      console.log('track ended')
+      // close video track
+    })
   
-  producerAudio.on('trackended', () => {
+    producerAudio.on('transportclose', () => {
-    console.log('track ended')
+      console.log('transport ended')
-    // close audio track
+      // close video track
-  })
+    })
-
+  // }
-  producerAudio.on('transportclose', () => {
-    console.log('transport ended')
-    // close audio track
-  })
 
   const answer = {
     origin_asset_id: ASSET_ID,
@@ -20688,7 +20713,7 @@ const connectSendTransport = async () => {
     origin_asset_type_name: ASSET_TYPE,
     origin_asset_name: ASSET_NAME,
     video_call_id: callId,
-    answer: 'accepted', // answer: accepted/rejected
+    answer: 'accepted', // answer: 'rejected'
   };
   console.log('SEND answer', answer);
 
@@ -20704,7 +20729,7 @@ const connectSendTransport = async () => {
 
 const createRecvTransport = async () => {
   console.log('createRecvTransport');
-  // See server's socket.on('consume', sender?, ...)
+  // see server's socket.on('consume', sender?, ...)
   // this is a call from Consumer, so sender = false
   await socket.emit('createWebRtcTransport', { sender: false, callId }, ({ params }) => {
     // The server sends back params needed 
@@ -20716,13 +20741,13 @@ const createRecvTransport = async () => {
 
     console.log('[createRecvTransport] params', params)
 
-    // Creates a new WebRTC Transport to receive media
+    // creates a new WebRTC Transport to receive media
     // based on server's consumer transport params
     // https://mediasoup.org/documentation/v3/mediasoup-client/api/#device-createRecvTransport
     consumerTransport = device.createRecvTransport(params)
 
     // https://mediasoup.org/documentation/v3/communication-between-client-and-server/#producing-media
-    // This event is raised when a first call to transport.produce() is made
+    // this event is raised when a first call to transport.produce() is made
     // see connectRecvTransport() below
     consumerTransport.on('connect', async ({ dtlsParameters }, callback, errback) => {
       try {
@@ -20756,7 +20781,7 @@ const resetCallSettings = () => {
 
 const connectRecvTransport = async () => {
   console.log('connectRecvTransport');
-  // For consumer, we need to tell the server first
+  // for consumer, we need to tell the server first
   // to create a consumer based on the rtpCapabilities and consume
   // if the router can consume, it will send back a set of params as below
   await socket.emit('consume', {
@@ -20768,7 +20793,7 @@ const connectRecvTransport = async () => {
       return
     }
 
-    // Then consume with the local consumer transport
+    // then consume with the local consumer transport
     // which creates a consumer
     consumer = await consumerTransport.consume({
       id: params.id,

public/index.js

@@ -15,6 +15,7 @@ console.log('[URL] ASSET_ID', ASSET_ID, '| ACCOUNT_ID', ACCOUNT_ID, '| callId',
 console.log('🟩 config', config)
 
 let socket, hub
+let doIHaveAudio = false
 let device
 let rtpCapabilities
 let producerTransport
@@ -129,6 +130,8 @@ const streamSuccess = (stream) => {
 
   videoParams = {
     track: videoTrack,
+    // codec : device.rtpCapabilities.codecs.find((codec) => codec.mimeType.toLowerCase() === 'video/vp9'),
+    // codec : 'video/vp9',
     ...videoParams
   }
 
@@ -139,6 +142,14 @@ const streamSuccess = (stream) => {
 
   console.log('[streamSuccess] videoParams', videoParams, ' | audioParams', audioParams);
   goConnect()
+  // console.log('[streamSuccess]');
+  // localVideo.srcObject = stream
+  // const track = stream.getVideoTracks()[0]
+  // videoParams = {
+  //   track,
+  //   ...videoParams
+  // }
+  // goConnect()
 }
 
 const getLocalStream = () => {
@@ -158,9 +169,23 @@ const getLocalStream = () => {
 
   navigator.permissions.query(
     { name: 'microphone' }
-  ).then((permissionStatus) =>{
+  ).then(function(permissionStatus) {
-    console.log('🟨 [PERMISSION] permissionStatus', permissionStatus); // granted, denied, prompt
+
-    // It will block the code from execution and display "Permission denied" if we don't have microphone permissions
+    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;
+      }
+    }
+
   })
 
 }
@@ -179,6 +204,7 @@ const goCreateTransport = () => {
 // server side to send/recive media
 const createDevice = async () => {
   try {
+    console.log('[createDevice] 1 device', device);
     device = new mediasoupClient.Device()
 
     // https://mediasoup.org/documentation/v3/mediasoup-client/api/#device-load
@@ -189,7 +215,7 @@ const createDevice = async () => {
     })
 
     console.log('Device RTP Capabilities', device.rtpCapabilities)
-    console.log('[createDevice] device', device);
+    console.log('[createDevice] 2 device', device);
     
     // once the device loads, create transport
     goCreateTransport()
@@ -261,7 +287,7 @@ const createSendTransport = () => {
       console.log('[produce] parameters', parameters)
 
       try {
-        // Tell the server to create a Producer
+        // tell the server to create a Producer
         // with the following parameters and produce
         // and expect back a server side producer id
         // see server's socket.on('transport-produce', ...)
@@ -287,16 +313,14 @@ 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
   // https://mediasoup.org/documentation/v3/mediasoup-client/api/#transport-produce
   // this action will trigger the 'connect' and 'produce' events above
   
-  // Produce video
-  producerVideo = await producerTransport.produce(videoParams)
   console.log('videoParams', videoParams);
+  producerVideo = await producerTransport.produce(videoParams)
   console.log('producerVideo', producerVideo);
-
   producerVideo.on('trackended', () => {
     console.log('track ended')
     // close video track
@@ -307,20 +331,21 @@ const connectSendTransport = async () => {
     // close video track
   })    
   
-  // Produce audio
+  // Video is mandatory, but audio may not be included
-  producerAudio = await producerTransport.produce(audioParams)
+  // if (doIHaveAudio) {
-  console.log('audioParams', audioParams);
+    console.log('audioParams', audioParams);
-  console.log('producerAudio', producerAudio);
+    producerAudio = await producerTransport.produce(audioParams)
+    console.log('producerAudio', producerAudio);
+    producerAudio.on('trackended', () => {
+      console.log('track ended')
+      // close video track
+    })
   
-  producerAudio.on('trackended', () => {
+    producerAudio.on('transportclose', () => {
-    console.log('track ended')
+      console.log('transport ended')
-    // close audio track
+      // close video track
-  })
+    })
-
+  // }
-  producerAudio.on('transportclose', () => {
-    console.log('transport ended')
-    // close audio track
-  })
 
   const answer = {
     origin_asset_id: ASSET_ID,
@@ -330,7 +355,7 @@ const connectSendTransport = async () => {
     origin_asset_type_name: ASSET_TYPE,
     origin_asset_name: ASSET_NAME,
     video_call_id: callId,
-    answer: 'accepted', // answer: accepted/rejected
+    answer: 'accepted', // answer: 'rejected'
   };
   console.log('SEND answer', answer);
 
@@ -346,7 +371,7 @@ const connectSendTransport = async () => {
 
 const createRecvTransport = async () => {
   console.log('createRecvTransport');
-  // See server's socket.on('consume', sender?, ...)
+  // see server's socket.on('consume', sender?, ...)
   // this is a call from Consumer, so sender = false
   await socket.emit('createWebRtcTransport', { sender: false, callId }, ({ params }) => {
     // The server sends back params needed 
@@ -358,13 +383,13 @@ const createRecvTransport = async () => {
 
     console.log('[createRecvTransport] params', params)
 
-    // Creates a new WebRTC Transport to receive media
+    // creates a new WebRTC Transport to receive media
     // based on server's consumer transport params
     // https://mediasoup.org/documentation/v3/mediasoup-client/api/#device-createRecvTransport
     consumerTransport = device.createRecvTransport(params)
 
     // https://mediasoup.org/documentation/v3/communication-between-client-and-server/#producing-media
-    // This event is raised when a first call to transport.produce() is made
+    // this event is raised when a first call to transport.produce() is made
     // see connectRecvTransport() below
     consumerTransport.on('connect', async ({ dtlsParameters }, callback, errback) => {
       try {
@@ -398,7 +423,7 @@ const resetCallSettings = () => {
 
 const connectRecvTransport = async () => {
   console.log('connectRecvTransport');
-  // For consumer, we need to tell the server first
+  // for consumer, we need to tell the server first
   // to create a consumer based on the rtpCapabilities and consume
   // if the router can consume, it will send back a set of params as below
   await socket.emit('consume', {
@@ -410,7 +435,7 @@ const connectRecvTransport = async () => {
       return
     }
 
-    // Then consume with the local consumer transport
+    // then consume with the local consumer transport
     // which creates a consumer
     consumer = await consumerTransport.consume({
       id: params.id,