ianramzy / decentralized-video-chat Goto Github PK
View Code? Open in Web Editor NEWπ Zipcall- Acquired @ 250k users π Peer to peer browser video calling platform with unmatched video quality and latency.
Home Page: https://zipcall.io
π Zipcall- Acquired @ 250k users π Peer to peer browser video calling platform with unmatched video quality and latency.
Home Page: https://zipcall.io
I think is a problem of WebRTC that isn't compatible with the new Microsoft Edge
When the second user connects, the first user's window will reload first. This resets any settings and therefore could be abused.
During a call, if one peer disables audio or video, the other peer could simply reload the page and re-join the call in order to trigger a reload for the first peer, causing the first peer to send audio and video again.
Right now the detection of unsupported browsers is sketchy at best. In the future feature, detection would be the way to go as @joepio suggested.
Maybe this library could help: https://github.com/muaz-khan/DetectRTC
Specific cases that need to be tested: Internet explorer, Older version of Edge, The built-in browsers in mobile apps such as Facebook, Messenger, Twitter, and Snapchat
the default http://localhost:3000 works, but when I change it to access by the actual IP address of the machine, like: http://192.168.0.1:3000/ , start a new chat, and the console gives me the following error:
chat.js:46 Uncaught TypeError: Cannot read property 'getUserMedia' of undefined
at Object.requestMediaStream (chat.js:46)
at startUp (chat.js:870)
at chat.js:941
NOTE: I'm pretty sure, the issues are caused by my lack on knowledge rather than by the script which works perfectly on my local machine and the server itself, as long as I'm using the initial port number.
Hi: I followed your advice and I started a node.js server, installed the script, but I think my build is not set up correctly...
I'm getting this page with and empty text screen:
https://mydomain.com/decentralized-video-chat/public/jointest
I had to manually type the .HTML extension so that the file would actually be visible in the browser (landingpage.html / newcall.html) without any port shown as part of the the URL (domain.net/decen...)
Once I picked my nick to start the video chat I got another blank page with this:
https://myserver.com/decentralized-video-chat/public/joinMYNICKNAME
PS: Please allow me to apologize since I'm quite new into node.js
Regards
Is there any chance we can get this option included for Firefox users?
A Changelog (maybe CHANGELOG.md) so users can know which are the newest changes of the project's new versions would be nice. Changes such as security patches, new features, bug fixes...
Seems like only two users can join at a time while the others have to wait
I don't know what is the problem :/ the npm start command doesnt work after changing anything in html or any file. for instance , if i just rename the title of the landing.html and close vs code and open it again and then do npm build , it doesnt work. if i clone the repo again , its fine but the same thing happens if i change something
Normally, the local video frame will increase in size when the window size increases, and vice versa.
However, this mechanism stops working after dragging the local video around.
Once dragged, it will keep it's current size, no matter the window size.
Hi there,
2020-05-19T22:22:54.438470+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=tvideobox.herokuapp.com request_id=e37ebffc-65c6-4439-814f-893f4022475b fwd="185.97.92.118" dyno= connect= service= status=503 bytes= protocol=https
2020-05-19T22:22:55.006801+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=tvideobox.herokuapp.com request_id=305c6712-30cc-4e23-9bf4-c7992c732f64 fwd="185.97.92.118" dyno= connect= service= status=503 bytes= protocol=https
could you help ?
Most likely due to a small button toucharea, makes the application feel unresponsive.
Did you start this own? If yes, How long did it take for you to build this from up-ground?
Would be nice to use this for just a regular call or screen sharing
when Sign up for free twilio account https://www.twilio.com/login,Verify Phone Number error,show Account is inactive. come from china.using mobile number.
I noticed that the following line quotes here should limit users once the room has 2 participants but it does not work.
decentralized-video-chat/server.js
Line 91 in 6101706
Hey can you please tell me why do we need twilio auth token and sid ?
in the LICENSE file I see Creative Commons Attribution-NonCommercial 4.0 International Public License
which I suspect is the one you meant? in package.json however the license is marked as ISC
The app looks really awesome and I love the clean UI! My understanding is various other video chat apps are also built on web rtc, so I would think they would also have the same video quality and latency as this app. Can you explain technically why this service has better video quality than other video chat apps? Or maybe change the headline to be "High quality, easy to use peer to peer browser video calling platform"?
Add new CSS to support mobile devices in portrait mode.
Maybe also make the buttons a bit larger when in landscape mode.
Best wishes!
The doc says it is decentralized but using Twilio STUN/TURN infrastructure. Given that there is no guarantee that the connections wont go through the Twilio's network, the claim should be toned down in my view.
You should at least give people a chance to use their own TURN servers.
The 'hide chat' icon is slightly wider than the 'show chat' one.
I need recording of call
Like let the room name is BusinessCall
I need to store the video streams screen shares like
Create folder named BusinessCall
Save videos as
User1.mp4
User2.mp4
User3.mp4
Audiouser.mp4
Screenshare.mp4
Chats.json
Is that possible?
Or guide me to implement on my own?
I'm not a person who video calls often, but many of my friends do but they prefer to do it on mobile. Most of them have desktops without a webcam too which makes it difficult. The site works well when I check the switch to desktop mode. The camera quality is better in mobile too. In that case it doesn't make sense why it isn't supported on mobile by default and it would give a better experience if it can natively support mobile platform.
I think custom TUN/TURN server support would be a great addition to this project if I can't use Twilio or don't want to.
Hi,
I have done every think , Its running good. But i need your help because i am unable to build this project .
I am using build Command: npm run build
My Package.json is :-
{
"name": "video-chat-master",
"version": "1.0.0",
"description": "",
"main": "server.js",
"scripts": {
"start": "node server.js",
"build": "react-scripts build",
"test": "echo "Error: no test specified" && exit 1"
},
"author": "yadav",
"license": "ISC",
"dependencies": {
"heroku-ssl-redirect": "0.0.4",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "^3.4.1",
"socket.io": "^2.3.0",
"twilio": "^3.47.0"
}
}
its comming error
C:\xampp\htdocs\suresh\video-chat-master>npm run build
[email protected] build C:\xampp\htdocs\suresh\video-chat-master
react-scripts build
Could not find a required file.
Name: index.html
Searched in: C:\xampp\htdocs\suresh\video-chat-master\public
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: react-scripts build
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\DELL\AppData\Roaming\npm-cache_logs\2020-07-01T13_39_29_409Z-debug.log
Please guide me how can i Build
Currently, when a user add an audio input or output device the page is refreshed to switch to the system default. An example of this is plugging in headphones. This is the current handler for when a change in audio sources is detected.
// On change media devices refresh page and switch to system default navigator.mediaDevices.ondevicechange = () => window.location.reload();
What would be better is if it would simply swap the stream to use the new system default audio. Or even better have a button to switch between audio inputs/outputs.
It would be great to have a documentation page / file, so we all can try to help on the project or self host or fork it!
Hi there,
There is this great feature on Zoom where you can set up a whiteboard where members of the meeting/call can draw on it. This is great for learning or just fun (e.g. with games). Would it be possible to add this to Zipcall? It would be great if it could!
When I hit on end call the video the caller video freezes and doesn't disappear immediately.
Since the URLs are just a gate pass for the video call, there might be a chance of getting intruders into the call with a simple brute force.
Users feel more secure if we have some passcode or approval from the creator to join into call.
First I'd like to say that your project is awesome. It works pretty well and I'm really glad and thankful you have chosen to go Open Source with it. As you say on your web page (and it's something I really love) "Zipcall is built privacy first." and I've seen some things that could be improved about it.
First it would be good also to remove the Google Analytics from the site. If you still want to use analytics you could use some privacy-friendly analytics like Maotomo, Ackee or Open Web Analytics or just using none of them at all.
Secondly, I see that you're using Twilio to get ephemeral credentials to use the TURN server. I don't think this really compromises the user privacy in any way, but I think it would be great, from a self hosting perspective, to find an alternative (it would be great if it didn't depend on a 3rd party) to do what Twilio is doing. In order to register there (I was trying to set up Zipcall locally) I need to give my phone number and that's a thing that I and maybe other users who are interested aren't willing to do. I would love to see different Zipcall instances working on the internet, this would be really great, so making thins easy for self hosting is a nice thing.
And lastly, it would be good to locally host the fonts you're getting from Google Fonts as there are some concerns about getting them via their API, you can read more here. I'd say the same with jQuery but I understand doing it the way you're doing it.
As I've said these are just some concerns I've seen, but it's nothing to really worry about. Your project is beautiful and works really well! Congratulations on this nice work you've done so far!!
RKMadugulas-MBP:decentralized-video-chat yesbro$ sudo npm start
[email protected] start /Volumes/Projects/ionic/Catchway Projects/dvc/decentralized-video-chat
node server.js
/Volumes/Projects/ionic/Catchway Projects/dvc/decentralized-video-chat/node_modules/twilio/lib/rest/Twilio.js:145
throw new Error('username is required');
^
Error: username is required
at new Twilio (/Volumes/Projects/ionic/Catchway Projects/dvc/decentralized-video-chat/node_modules/twilio/lib/rest/Twilio.js:145:11)
at initializer (/Volumes/Projects/ionic/Catchway Projects/dvc/decentralized-video-chat/node_modules/twilio/lib/index.js:9:10)
at Object. (/Volumes/Projects/ionic/Catchway Projects/dvc/decentralized-video-chat/server.js:8:31)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
at startup (internal/bootstrap/node.js:283:19)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: node server.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/yesbro/.npm/_logs/2020-06-30T13_26_26_606Z-debug.log
It's just a question, is it possible to somehow support group calls? I do know that it's P2P so it could be complicated, but it's an area that is out of my reach.
I understand NAT traversal is at play to make the connections for the call in order to make it P2P and that should it fail it will utilise another server as a relay.. Can someone configure their router to let such a connection through like utilise port forwarding? If so, which ports would be required to be opened?
When pausing your own video, there's still video being recorded, but it's not sent to the peer.
The video pausing should stop the webcam from recording, so that all indicators are off and anyone using the app can be sure that they can't be seen.
Does not work in Microsoft Edge Chromium
What is the rough figure you have tested in the past of MAX simultaneous connections?
Thanks
Hugo
I cloned the repository and changed the .env file accordingly. However when trying to access I get the error:
Forbidden You do not have permission to access this document.
Also, does Twilio charge anything when using your selfhosted Zipcall?
Hello, Love the Product!!
when i was on a call using Plantronics PLT Bluetooth headset everytime i spoke there was a bass tone noise whist speaking, the other user couldn't hear it and its only when i use headphones
For some reason, Zipcall reloads every few minutes at least on zipcall.io, disrupting the call. I donβt think this behavior is intended, is it?
Awesome project, looks promising. How many users could connect simultaneously at same video call?
By default, the connection will be made peer-to-peer. However, if this fails, a TURN
server is used to properly route the video between the participants and enable them to still exchange data.
A notice should be shown to the user whenever the TURN
server kicks in in order to inform them that peer-to-peer can't be used and their data is being routed by a third party, in order to be fully transparent.
Hi,
Very neat solution, love it!
It works for my phone (Safari) vs PC (new Edge) using the same home wifi.
But it does not work with PC 2 PC, both uses latest version of chrome / chromium based Edge, running in windows 10.
What it shows is it stays in the βloadingβ/ awaiting other to join status.
And there is no error log in the console.
I can tell both PCs are behind home routers over the internet (me and my friend), but it should not be a problem, rightοΌ
Does requiring a Twilio account categorise at being free, forget open source?
When hitting send on a chat message, a scrollbar will briefly appear and then disappear again.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.