Socket io Server side receive an empty stream #4205

AhmedElTabarani · 2021-12-07T13:28:23Z

AhmedElTabarani
Dec 7, 2021

I try to send the stream to the server side (nodejs), but it receives an empty value, although it has a value in the client side

in the script.js I try to access the camera and microphone
then after emit 'join-room' and emit 'user-joined-room'from server
I print the value of id and stream after listening on 'user-joined-room'

script.js (client side)

const socket = io('/', {
  upgrade: false,
});

const peer = new Peer(undefined, {
  host: '/',
  port: 443,
  path: '/peerjs',
});

peer.on('open', (id) => {
  socket.emit('join-room', 'temp-room', id);
});

// access the camera and microphone
navigator.mediaDevices
  .getUserMedia({
    video: true,
    audio: true,
  })
  .then((stream) => {
    socket.on('user-joined-room', (id) => {
      console.log('id: ', id, 'stream: ', stream);
      // send his stream to the server
      socket.emit('send-stream', id, stream);
    });
  });

output after listening on 'user-joined-room'

in app.js after listening on 'send-stream' I get an empty stream

app.js (server side)

require('dotenv').config();
const express = require('express');
const http = require('http');
const cors = require('cors');

const app = express();
const server = http.createServer(app);
const io = require('socket.io')(server);
const { ExpressPeerServer } = require('peer');
const peerServer = ExpressPeerServer(server, {
  debug: true,
});

app.use('/peerjs', peerServer);

app.use(express.static('public'));

app.use(express.urlencoded({ extended: true }));
app.use(express.json());

const PORT = process.env.PORT || 443;
server.listen(PORT, () => {
  console.log('server listening on http://localhost:' + PORT);
});

app.use(cors());

// connection to socket.io
io.on('connection', (socket) => {
  // new user join the room
  socket.on('join-room', (room, id) => {
    socket.join(room);
    // tell all user that new user joined the room
    socket.broadcast.to(room).emit('user-joined-room', id);
    // receive the stream from the client
    socket.on('send-stream', (id, stream) => {
      // send the stream to all users in the room
      console.log('id: ', id, 'stream: ', stream); // it print empty stream !!
    });
  });
});

output after listening on 'send-stream'

id:  8c728366-d5c1-46f9-8eda-44656a3a5cd0 stream:  {}

see it print an empty stream

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta id="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Home Page</title>
    <link rel="shortcut icon" href="#" />
    <script src="/socket.io/socket.io.js"></script>
    <script src="https://unpkg.com/[email protected]/dist/peerjs.min.js"></script>
    <script defer src="script.js"></script>
  </head>
  <body>
    <h1>Welcome to the Home Page</h1>
  </body>
</html>

I posted the question on Stack Overflow here, but I re-posed it here for the benefit -- and I want a solution 🤫 --

darrachequesne · 2021-12-13T07:23:32Z

darrachequesne
Dec 13, 2021
Maintainer

Hi! I don't think that is possible, as the stream is not serializable. Maybe a plain WebRTC server is what you are looking for?

2 replies

AhmedElTabarani Dec 13, 2021
Author

I tried to use media recorder and make a buffers and send it to the server, that works.

But what you meant by using plain WebRTC Server ?

darrachequesne Dec 16, 2021
Maintainer

Sorry, I misunderstood. Yes, you are right, a media recorder to extract buffers from the stream is the way to go.

Reference: https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Socket io Server side receive an empty stream #4205

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment 2 replies

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Socket io Server side receive an empty stream #4205

Uh oh!

AhmedElTabarani Dec 7, 2021

script.js (client side)

output after listening on 'user-joined-room'

app.js (server side)

output after listening on 'send-stream'

index.html

Replies: 1 comment · 2 replies

Uh oh!

darrachequesne Dec 13, 2021 Maintainer

Uh oh!

Uh oh!

AhmedElTabarani Dec 13, 2021 Author

Uh oh!

darrachequesne Dec 16, 2021 Maintainer

AhmedElTabarani
Dec 7, 2021

Replies: 1 comment 2 replies

darrachequesne
Dec 13, 2021
Maintainer

AhmedElTabarani Dec 13, 2021
Author

darrachequesne Dec 16, 2021
Maintainer