0x5eba / video-meeting

Google Meet / Zoom clone in a few lines of code

Video Meeting

Google Meet / Zoom clone in a few lines of code.

Video Meeting is a video conference website that lets you stay in touch with all your friends.

Developed with ReactJS, Node.js, SocketIO.

Website

Try Video Meeting here video.sebastienbiollo.com

Features

• Is 100% free and open-source
• No account needed
• Unlimited users
• Messaging chat and video streaming in real-time
• Screen sharing to present documents, slides, and more
• Everyting is peer-to-peer thanks to webrtc

Local setup

1. yarn install
2. yarn dev

video-meeting's Issues

Pls how did you make it ?

Pls tell how did you make it full steps in a video pls

After the project is deployed, enter the URL and click Go 404. How do I set it?

After the project is deployed, enter the URL and click Go 404. How do I set it?
After deployment, index. HTML can be accessed normally, but other input does not, and error 404 is reported. How to solve this problem

Chat isn't cleared

Hi! Your website is amazing! Just the problem is that The chat isn't cleared after a new person joins the meeting... In the same url

How to install "yarn install" / "yarn dev"

root@ubuntu:/var/www/html/meet# yarn dev
00h00m00s 0/0: : ERROR: [Errno 2] No such file or directory: 'dev'
root@ubuntu:/var/www/html/meet# yarn install
00h00m00s 0/0: : ERROR: [Errno 2] No such file or directory: 'install'

Download

Hello l just made http://caspian.rf.gd/index.html/ for testing the file on my own website it did not work please help!

Pre-defined Username

When I start a meeting, I see that a default username is randomly generated.

I'd like to create custom/unique URL that would automatically start/join a meeting with a pre-defined username.

For example, one option might look like: http://localhost:8000/session&user=Tom would automatically connect to a meeting with "Tom" as the username".

There may be other ways to do this... I'm open to suggestions. Thanks!

App works fine; just in one browser, but not in a different browser not in a different computer

Dear @0x5eba, Thank you very much for the demo and the code, which has helped us all progress. The app, either in your demo, or our owns built on your own, it perfectly works in one browser, and the call is wonderful. However, on a different browser, and a different computer it does not work, just a blank window. I've tested different changes to no avail. Would it be possible to please assist? Is it an issue with STUN server, TURN server or certain resources or limitations? Thank you very much.

Audio Not Working when screensharing.

Hello!
I was doing some testing seeing if I could add anything but it appears the audio does not work when the user screenshares. Please could you investigate the issue.

Server Error

Error: ENOENT: no such file or directory, stat 'C:\Users\TOSHIBA_2\Desktop\My Projets\Sample Meet\zoom-meeting\build\index.html'

error on video.js

Hello,

When run on my another system then below error comes.

Lateral inversion

In the video section Lateral inversion is not there like in mirror when we raise our left it also raises it's left hand try to sort out that problem

You need to enable JavaScript to run this app.

when deployed using firebase getting preview response of socket "You need to enable JavaScript to run this app."

https://video-meet-b5a51.web.app/socket.io/?EIO=3&transport=polling&t=NBCcd3V

Please tell me how to fix this

Hosting issue

How to host it on heroku or git pages?

DOMException: Failed to execute 'setRemoteDescription'

Hey, I am getting this error when user-1 create a room and 2nd user join it

DOMException: Failed to execute 'setLocalDescription' on 'RTCPeerConnection': Failed to set local offer sdp: Called in wrong state: kHaveRemoteOffer

Cannot GET / on starting the application

I have started the application using yarn install and yarn dev (also tried npm start and npm run dev). On accessing localhost on the browser it shows Cannot GET / (attached the screenshot of terminal and browser). How can this be fixed? Thank you!

npm install

Are the videos encrypted end to end / secure?

Greetings and thanks for making this app open source,
Can you give me some clarity on whether the video chat is end to end encrypted and secure?

If no, how this can be achieved in your app?

Thanks,
Satyam.

hosting issue

When i upload it on shared hosting after npm run build its work perfect on same browser but when i invite someone to join meeting at that time his video did not show. i see same issue on your demo

i am unable to achieve sidebar layout like google-meet does

When "A" user clicks on "B" video image, it gets zoom on main screen and replaces the "A" main image

microphone not working while sharing a screen

presenting screen the microphone not working

unable to run in my localhost

can you please tell me the procedure on how to run the project on localhost.

Great app!

Hi , i want to know how many user can join in conference? its can handle same time 100 user or more?

Video/Audio ScreenStream do not work.

I setup sources on host http://85.93.145.4:8000/

log on "yarn dev":

==================================================
root@elektrika:~/meet# yarn dev
yarn run v1.22.4
$ concurrently -n 'server,client' -c 'red,green' "nodemon app.js" "NODE_ENV=production PORT=8000 react-scripts start"
[server] [nodemon] 2.0.4
[server] [nodemon] to restart at any time, enter rs
[server] [nodemon] watching path(s): .
[server] [nodemon] watching extensions: js,mjs,json
[server] [nodemon] starting node app.js
[server] listening on 4001
[client] ℹ ｢wds｣: Project is running at http://0.0.0.0:8000/
[client] ℹ ｢wds｣: webpack output is served from
[client] ℹ ｢wds｣: Content not from webpack is served from /root/meet/public
[client] ℹ ｢wds｣: 404s will fallback to /
[client] Starting the development server...
[client]
[server] http://85.93.145.4:8000/ggg [ 'h5aSuU6hl-LeZqxoAAAA' ]
[server] http://85.93.145.4:8000/ggg [ 'h5aSuU6hl-LeZqxoAAAA', 'omxkhLbvNyJcATLPAAAB' ]
[client] Compiled with warnings.
[client]
[client] ./src/Video.js
[client] Line 127:39: Function declared in a loop contains unsafe references to variable(s) 'connections', 'socket', 'connections' no-loop-func
[client] Line 153:41: Function declared in a loop contains unsafe references to variable(s) 'connections', 'socket', 'connections' no-loop-func
[client] Line 189:39: Function declared in a loop contains unsafe references to variable(s) 'connections', 'socket', 'connections' no-loop-func
[client] Line 350:43: Function declared in a loop contains unsafe references to variable(s) 'connections', 'socket', 'connections' no-loop-func
[client]
[client] ./src/Home.js
[client] Line 21:8: 'url' is already defined no-redeclare
[client]
[client] Search for the keywords to learn more about each warning.
[client] To ignore, add // eslint-disable-next-line to the line before.
[client]

Video/Audio ScreenStream do not work.
May be need to setup SSL certificate ?

How to set the limit to number of particpants??

Hey there,
I am using your video meet but i want to set a maximum limit of number of participants in a room. So can you please say what to do so that i can have an option to set a maximum limit for the number of participants in a room.

Thanks,
Atharva.

not working

not working

Is this compatible with chrome?

Hello there, how are you doing today? i have a quick question, am i able to run this code on chrome? if yes then how? please let me know. Thanks! <3

This project sucks

Not able to run

Cannot GET /

can you help me . My mail [email protected]

Socket don't match when deploy

Hey i deploy the app on app.netlify.com
but when the deployement success socket don't match
this is my package.json
it open app normally when other user joined don't attach videos

{"name": "video",
  "version": "0.1.0",
  "private": true,

  "dependencies": {
    "@material-ui/core": "^4.9.7",
    "@material-ui/icons": "^4.9.1",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "antd": "^4.1.4",
    "bootstrap": "^4.4.1",
    "concurrently": "^5.1.0",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "faker": "^4.1.0",
    "nodemon": "^2.0.2",
    "react": "^16.13.1",
    "react-bootstrap": "^1.0.0",
    "react-css-grid": "^2.0.0-0",
    "react-dom": "^16.13.1",
    "react-flexbox-grid": "^2.1.2",
    "react-grid-layout": "^0.18.3",
    "react-grid-system": "^6.3.0",
    "react-router": "^5.1.2",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.4.1",
    "reactstrap": "^8.4.1",
    "serve": "^14.0.1",
    "socket.io": "^2.3.0",
    "socket.io-client": "^2.3.0",
    "standard": "^14.3.3",
    "xss": "^1.0.8"
  },
  "scripts": {
    "dev": "concurrently -n 'server,client' -c 'red,green'  \"nodemon app.js\" \"SET NODE_ENV=dev react-scripts start\"",
    "start": "react-scripts start",
    "server": "SET NODE_ENV=production nodemon app.js & react-scripts start",
    "build": "react-scripts build",
    "heroku-postbuild": "npm run build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }}

and this is my configuration netlify netlify.toml

[build]
  command = "npm run build"
  publish = "/build"
  base ="/"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

web cam light is still on, when I click the close camera button

404 error not found

Hello! i am currently trying to implement this into a subdomain on my website which is zoom.selync.ga. the index.html file seems to work just fine but once i press go it gives me a 404 error and i can not start a new meeting.
please help, thanks!

What is the reason the app does not work on safari?

Hey I've been editing the code and it works perfectly for Firefox and Chrome. I am curious though as to why it doesn't work on other browsers such as Safari? I have commented out the code that renders a message if the browser is not chrome as shown below. If anyone has any ideas I am super curious. Thanks so much!

setup in subdomain

how setup / install on subdomain? example : meeting.mydomain.com

How do i add other broswer support

Good day friends, please how do i add other browser support.

how to record and download video?

how to record and download video?

some of the variables on the server are not defined

Great project! Thank you so much for making this. One minor thing I noticed after cloning the repo and inspecting it in VS Code is that there are a few variables that are not defined on the server. Do you need to declare sanitizeString, connections, messages, and timeOnline with the const keyword? Thank you so much

Hello, How to install this and how to run, this dont have screen recording and making mp4 files of meetings. Am I right?

Hello, How to install this and how to run, this dont have screen recording and making mp4 files of meetings. Am I right?
KIndly clear with me.

Screen Capture Is Reversed (left side to right side)

I try with the domain demo, and i try the screen capture feature but it goes reversed so my text is not readable

How to deploy it on web hosting

Hi, I am new to react, could you write an manual how to upload it to web hosting such as cpanel, etc.?
I tried it but could not been able to get it to work.

TypeError: connections[socketListId].addStream is not a function

Unable to join in Linux & Mac.

But The Below Error Screen is showing in MAC but not on Linux

In 'connections[socketListId].addStream(window.localStream)', 'connections[socketListId].addStream' is undefined

Cannot GET /

HELP
Cannot GET /