GithubHelp home page GithubHelp logo

muaz-khan / webrtc-experiment Goto Github PK

View Code? Open in Web Editor NEW
11.6K 663.0 3.9K 32.75 MB

WebRTC, WebRTC and WebRTC. Everything here is all about WebRTC!!

Home Page: https://www.webrtc-experiment.com/

License: MIT License

JavaScript 73.24% HTML 24.38% CSS 2.02% PHP 0.18% C# 0.07% ASP 0.01% TypeScript 0.12%
webrtc webrtc-demos webrtc-experiments webrtc-samples webrtc-examples webrtc-tools webrtc-libraries

webrtc-experiment's People

Contributors

ashwinrkjain avatar cowlicks avatar hubertgrzeskowiak avatar ijatsu avatar killmenot avatar madis avatar morenoh149 avatar muaz-khan avatar mvayngrib avatar pavelkonon avatar z4c avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

webrtc-experiment's Issues

Pluginfree-Screen-Sharing.html

  1. your online Pluginfree-Screen-Sharing.html Works! Congratulations
  2. The file of that name in your github directory is not the same file (it attempts video)
  3. Even when I use the online version of Pluginfree-Screen-Sharing.html on my own server, it doesn't work. (The button does nothing. And the private link goes back to google drive).
  4. Help?

[email protected]

no video

Chrome (26, gnu/linux - kubuntu) did not ask me to allow video
and I do not see any video (of myself)

RTCMultiConnection can not signaling with socket.io over node.js example code

i do not if i did it wrong.

if test this demo https://webrtc-experiment.appspot.com/RTCMultiConnection/video-conferencing/ with custom signaling.

the client code is

openSignalingChannel: function(config) {
   URL = 'http://localhost:8888/';
   channel = config.channel || this.channel || 'Default-Socket';
   sender = Math.round(Math.random() * 60535) + 5000;

   io.connect(URL).emit('new-channel', {
      channel: channel,
      sender : sender
   });

   socket = io.connect(URL + channel);
   socket.channel = channel;

   socket.on('connect', function () {
      if (config.callback) config.callback(socket);
   });

   socket.send = function (message) {
        socket.emit('message', {
            sender: sender,
            data  : message
        });
    };

   socket.on('message', config.onmessage);
}

the server side code i use is from https://github.com/muaz-khan/WebRTC-Experiment/blob/master/socketio-over-nodejs/webrtc-signaling/signaler.js

i open two tab in my browser, but it can not signaling.

Screensharing Question

I had some questions regarding screen sharing in Chrome. On one of your demo pages, I found this limitation.

You requested audio-stream alongwith 'chromeMediaSource' – it is not permitted in a "single" getUserMedia request.

Some questions I had:

  1. Is it possible to have all four options (Screen, video, audio, and data) going at once?
  2. If yes to No. 1, then is it just a matter of creating a new media request in the session? Is that possible?
  3. If no to No.1, is this an implementation issue with Chrome or can you think of a possible work around?

Finally, I just want to say that all of your work on WebRTC has been fantastic. Really great stuff.

Repeated Streams & Mute/Unmute

First of all, congratulations on your amazing work! :-) I'd like to ask a couple of questions:

  1. Do you have any idea on how to prevent the existence of repeated streams (such as when a participant opens multiple browser tabs and connects to the same room)?
  2. Is there any way I can mute/unmute my own stream at will given an already established connection (such that other participants don't hear what I say)?

Self-hosted Screen-Sharing

I noticed the Pluginfree-Screen-Sharing is using the services at firebaseio.com

Is that possible to self hosted it?

Which node.js file we could use to start the services?

Thanks,

demo doesn't initialize remote connection

So I have two laptops at home both using the latest chrome at home. I tried your demo to simulate a one-to-one connection using video+audio but I had difficulties getting them to initialize the remote connections. Is this an issue on your end or does this plugin prevent the same connection from happening that shares the same router?

Peer connection problem

I'm having a problem with one client when somebody offers to the client RTCPeerConnection connection finishes just fine, but when client send offers to other clients connection is never established. The client is located in US, I've tried with different clients from Europe and everything works just fine.

DataChannel features

Hi!
So far this seems to be the best library/project/solution for a P2P chat, but DataChannel seems to be missing some crucial features:
1: It would be great, if there was no separate "create room", and "join room", but rather check if room exists, and if it does, join it, otherwise create it.
2: channel.onclose event does not seem to be working currently.
3: Maybe it's just me, but I can't see any way of following/identifying, who is in the room currently, and who has sent the message in a many-to-many connection.

PeerJS seems to be the only other functional solution, but they have a custom server for setting up communication, and it needs API key, and I have asked, and they are not willing to give Firebase support, so that's a no go.

I have tried to fix the above mentioned problems myself and than maybe do a push, but the task seems to be above my head. :(

Data remained in firebase.

Thank you a lot for your help!

I tried the latest version "RTCMultiConnection_1.2" yesterday with the given demo "user-ejection" using my own firebase site.

I found that there is data remained in my firebase after connection even though the web pages are closed (The remained data is user id varying from 0~9999 giving below).
image
And the "audio-conference" mode in the earlier version "RTCMultiConnection_1.1" doesn't have this problem.

I read the code of "RTCMultiConnection_1.2" and find that the method "socket.onDisconnect().remove()" isn't attached to every firebase socket but only the initiator's socket.

    self.open = function (_channel, extra) {
        ......

        if(self.socket) self.socket.onDisconnect().remove();
    };

I think that the above function means that only the initiator's quit will delete it's data in firebase. It causes the data remaining problem. But if I attach "onDisconnect().remove()" method to every firebase connection in the function "openSignalingChannel", just as what the version 1.1 did, then any member's quit will remove the whole room data in firebase.

Would you please tell me whether I can fix this problem?

Sorry for my poor English.

No way to know whether to create a room, or join one

One of the current problems I'm experiencing with RTCMultiConnection-v1.2.js with the socketio-over-nodejs server is the lack of a proper way to establish a session. I'm currently using the hack that waits 5 seconds to see if it gets a session invite, otherwise it creates a new channel, but it's pretty unreliable, especially with a slow connection.

I feel like there should be a way to ask the server - "does this room exist?" - like you do with Firebase. Otherwise the two people who want to chat have to go in one at a time, which is not always practical. And a 5 second wait is quite long...especially when testing over and over :)

how to know...

hi, how to know if i use RTCMultiConnection() :

  1. if the distant user is using a media communication (audio, video) ?
  2. the user id attached to stream...
  3. if the distant user is connected or disconnected and cut the connection with a specific user?

RTCDataChannel failure on LAN

On those systems connected over LAN, RTP media streams flows finely but SCTP or RTP-data streams not.

RTCDataChannel is unable to establish connection over LAN.

Maybe this is a known bug in chromium or Gecko.

For example, following experiments works fine on those LAN oriented systems:

  1. video conferencing
  2. screen sharing
  3. video broadcasting
  4. one to one video chat

But following experiments fails:

  1. Group text chat using RTCDataChannel
  2. Group file sharing using RTCDataChannel
  3. Part of screen sharing using RTCDataChannel

Remember, personally I've not tested RTCDataChannel specific experiments on LAN.

passing variables

It would be nice if we could pass userid in methods open and connect.
For example: channel.open('default_channel','lodkijd');
where lodkijd would be a userid. If the second parameter is missing then it can be generated as it was before(random string)

Remove remote video stream when somebody leaves

Yesterday, I started play with this library with Node.js. I am not sure if this issue is on my browser or code.

When somebody leaves or closes the browser, the video stream of the person does not come off the remote video list. It would be nice if somehow onbeforeunload event it notifies everybody the user has left and removes the video stream from the list.

Room init

It is able to create room in conference without main (initiator) user ?
Can intiator leave room and other clients would be stay in there ?
Thanks.
Sorry for english.

audio recording demo

audio recording is not recording audio. i cannot hear anything from recorded file eg.audio.wav from your site. Please help

Window 8 support

Thank you a lot for your help!

I tried the version "RTCMultiConnection_1.2" in my own site. I find that the "many-to-many" audio conference runs very well in Ubuntu 12.04 system. But if I use Windows 8 system to visit the same site, it won't work most of the times.

After comparing these two systems, I think that the firewall of Windows 8 did something to prevent the flowing of our audio stream. Could this happen?

Remote File Access

I'm thinking to add new experiment for remote files collaboration and access. WebRTC data channels can be used for synchronization. Is this experiment will matter? ....or?

Any suggestions for features to be added in that remote file accessing experiment?

Allow users to join conference without having to stream their own video/webcam

If I understand correctly, for somebody to participate in a conference, they must use video stream as well. Is there a way to allow people to join the conference without having to use their camera?

Eg. I would like to invite a friend to a conference, however it would be up to him to stream from this end. He should basically see and chat with others without him having to share his video stream.

I tried "Deny" button when it prompt me to share webcam, the app did not allow me join the room/session.

all things to add in RTCMultiConnection.js library

hi, my ideas

function startBroadcasting() {
    defaultSocket.send({
        sessionid: self.sessionid,
        userid: self.id,
        session: config.session,
        direction: config.direction
    });

    if (config.direction === Direction.OneToOne) {
        if (!window.isFirstConnectionOpened)
            setTimeout(startBroadcasting, 3000);
    } else
        setTimeout(startBroadcasting, 3000);
}

Change the default time (3000) by a optional time e.g.

webRTC = new RTCMultiConnection();
webRTC.broadcast = 1000 * 60;
  1. can add any datas to send with the broadcast (by a onXXXXX(data) function ?? ) and intercept the receive by a onXXXXX(data).

  2. if we use a private openSignalingChannel with the RTCMultiConnection library, we must can specify a global name to send the broadcast ( startBroadcasting() ) and a session name .

eg

connection.openSignalingChannel = function (config) {
    var socket = io.connect('http://your-site:8888');
    socket.channel = config.channel || this.channel || 'default-channel';
    socket.on('message', config.onmessage);

    var bdc = config.broadcastchannel || this.broadcastchannel || 'default-broadcast';

    socket.on(bdc, config.onboradcastmessage);


    socket.send = function (data) {
        socket.emit('message', data);
    };

    socket.sendbroadcast = function (data) {
        socket.emit(bdc, data);
    };

    if (config.onopen) setTimeout(config.onopen, 1);
    return socket;
}

RecordRTC and best way and how to save on server

Hi Mauz
Have been playing with your experiments - they are great and very interesting. Please excuse me but I am not a java script person at all - my limitation is a small (very) bit of jQuery - php etc. I have no problem with so if you have already answered this question I apologise.

So I run the RecordRTC "file/s" on my server I can record video and I can stop, I can then view that video (in terms of your demo page), but how do I/can I send/save the file which I assume is a temp file(?) to the server.

The demo page shows this:

/* stop recording video and save recorded file to disk */
recorder.stopVideo(function(recordedFileURL) {
window.open(recordedFileURL);
});

but is that actually saving the file because my basic understanding is that just opens another window.

Lets say I run the demo on page "record.php" and I have a folder "recordings" how do I get the file into recordings and save it?

Cheers

Problem with RTCMultiConnection multi conference

I use your latest bandwidth demo, and it works fine with one-to-one conference. But if i trying to connect more than one videos, i get infinity ["setTimeout(onRemoteStreamStartsFlowing, 300)"] message in chrome console and new peers doesn't connect to session. What's the problem? Is it bug of my browser, web-camera, etc. or RTCMultiConnection library?

PS sorry for my bad english

Running video-conferencing without firebase

Hi Muaz,

I am trying to run your video-conferencing example and replace Firebase with my local node.js server. As your example makes use of the Firebase API I am wondering whether you have already a node.js wrapper around socket.io that will run with the video-conferencing example?

I saw your other experiments with socket.io and node.js but that doesn't seem to provide a suitable implementation for the API.

Thanks in advance
Mumin

I can't make the RecordRTC example run

I tried running the code downloaded from the repo first, didn't work. Then I tried copying the index.html RecordRTC.js and audio-record.js from the live online example - didn't work either. I'm having hard time troubles shooting the issue because I get no errors.

Important to note - the live example work great.

stop to many getUserMedia request to the user

I have seen that every time you start a call/session, RTCMulti asks user the approval again.

Inside the function getUserMedia(), can't we save the current local stream, and reuse it every time it's asked?

Example:

        var userMediaInited = false;
        var userMediaStream = null;
        function getUserMedia(options) {
        var n = navigator,
            media;
        resourcesNeeded = (options.constraints || {
                audio: true,
                video: video_constraints
            };

        if(userMediaInited && userMediaStream
                           && userMediaInited.audio >= resourcesNeeded.audio
                           && userMediaInited.video >= resourcesNeeded.video)
            streaming(userMediaStream)
        else{
                 n.getMedia = n.webkitGetUserMedia || n.mozGetUserMedia;
                 n.getMedia(resourcesNeeded, streaming, options.onerror || function (e) {
                       console.error(e);
                 });
        }
        function streaming(stream) {
            video = options.video;
            if (video) {
                video[moz ? 'mozSrcObject' : 'src'] = moz ? stream : window.webkitURL.createObjectURL(stream);
                video.play();
            }
            options.onsuccess(stream);
            userMediaStream = media = stream;
        }

        return media;
    }

The issue of performance

Is it possible to reduce the load on the processor in the video? What affects the load? Can be a great camera resolution? If more than three parties becomes very slow.

unable to get remote stream in case when a “remote stream” is attached by calling “peer.addStream(remoteStream)

Issue: unable to get remote stream in case when a “remote stream” is attached by calling “peer.addStream ( remoteStream )”

Is it beneficial to attach remote stream?

Yeah, it allows us overcome burden from a single peer. Burden will be shared.

Also, we can support a wide range of peer’s connectivity.

How to attach remote stream?

var MediaStream = window.webkitMediaStream || window.MediaStream;

firstPeer.onaddstream = function(remoteSteam) {
      remoteStream = new MediaStream(remoteSteam.audioTracks, remoteSteam.videoTracks);
      otherPeer.addStream(remoteStream);  /* attaching remote stream */
};

What I want to do?

WebRTC -Experiment

  1. First peer will handle first three peers
  2. 2nd peer will handle next three peers (5, 6, 7)
  3. 5th peer will handle next three peers (8,9,10)
  4. 8th peer will handle next three peers (11, 12, 13)
  5. And so on.

We will get following benefits (in case of success):

  1. Video will never freeze for 11th and upper peers
  2. 1st peer don’t need to handle all participants
  3. You don’t need to install/buy a middle server (like Asterisk) for small projects (to support a few hundred peers’ connectivity)

A known bug in chromium: peer.onicecandidate not fires for 11th peer. You don’t need to worry about that bug!!

Pitfall: If peer number 1, 2, 5, 8 … tries to leave the room without informing other peers to play a host role.

WebRTC -Experiment

If peer number 2 leaves the room, without informing master peer or peer number 5 to handling upcoming peers.

A demo experiment to test it:

https://googledrive.com/host/0B6GWd_dUUTT8V1Fodm9WQldkb28/

Open 4 tabs....1st table should create room……..join room from other tabs.....see the behavior of the 4th tab.

own turn server not involved

Hi Muaz,

I have successfully managed to run your socketio-over-nodejs experiment on my local machine (Firefox to Chrome) and between different notebooks within our corporate network.

The second try was to run the signaling server on an EC2 instance (AWS) and connect again two notebooks from within the same corporate network (worked as well). Then I tried to connect two notebooks being in totally different networks. Signaling still via AWS worked but the audio/video stream was not established between the two endpoints (NAT problem I guess).

So I tried to setup an own turn server on AWS using https://code.google.com/p/rfc5766-turn-server. Added user, pw and opened TCP and UDP STUN port 3478. Finally, added own server to RTCPeerConnection (v1.5) like this:
var iceServers = {
iceServers: [
{
"url":"turn:[email protected]", "credential":"userXYZsecret"
},
{
url: !moz ? 'stun:stun.l.google.com:19302' : 'stun:23.21.150.121'
}
]
};

With this I expected that my turn server would be connected, but it isn't. Within our corporate network it is still working but I see no access to this turn server. Firefox console tells me:
In RTCConfiguration passed to RTCPeerConnection constructor: Credentials not yet implemented. Omitting "turn:userXYZ@54....."

That obviously means RTCPeerConnection V1.5 does not support this yet, right?

I have seen that you have released a version 1.6 already, although the version within this experiment is still v1.5. Simple replacement didn't work (even the local communication wasn't working after this change. Any idea what goes wrong here?

BTW, have you ever tried to use a video stream (e.g. provided by VLC or so) as and additional video source for your experiments? I have a demand for transmitting this in parallel to the local webcam (i.e. audio/video conf plus the extra video stream) and no idea if thats possible and where to start.

Thanks in advance!

How can I using Websocket ?

What if I want to use my own WebSocket ?

I don't know how to modify the following code...
var socket = new WebSocket('ws://your-websocket-url/');

should I do something in my websocket-url?

Firefox to Chrome streaming is NOT working!

Test this WebRTC Chrome to Firefox video conferencing demo. It works fine if Chrome Beta is OFFERER and Firefox Nightly is ANSWERER.

https://googledrive.com/host/0B6GWd_dUUTT8dW5ycGVPT0V1bTg/chrome-to-firefox.html

It fails if Firefox Nightly creates Offer-SDP and chrome beta tries to create Answer SDP.

Though, it gets remote stream finely in both cases. But the blank stream in 2nd case!

Here is the source code:
https://github.com/muaz-khan/WebRTC-Experiment/tree/master/chrome-to-firefox

I think the original issue comes in this line:

https://github.com/muaz-khan/WebRTC-Experiment/blob/master/chrome-to-firefox/RTCPeerConnection-v1.4.js#L49

About the RecordRTC example

I can't get the voice data.
I try this demo on chrome 27.0 dev,there is no Web Audio Input in about:flags,the video record works well,but the wav file is silent,the length of the file is right. After debug,I found that in the onaudioprocess evevt,the input buffer array's data were 0.Does this demo works well on winXP?

Screensharing Issue

So here's the scenario. I'm hoping you could help shed some light on what's happening.

This seems to work.

  1. Computer A starts a session. Video and audio start normally.
  2. Computer A starts screensharing. Video is replaced with screensharing.
  3. Computer B joins the session.
  4. Data still works.

This doesn't work.

  1. Computer A starts a session. Video and audio start normally.
  2. Computer B joins the session. Video and audio start normally.
  3. Computer A starts screensharing. Video is replaced with screensharing.
  4. Computer B receives a bug: Uncaught Multi-capturing of screen is not allowed. Capturing process is denied. Are you enabled flag: "Enable screen capture support in getUserMedia"?
  5. Data doesn't work.

Right now, I'm just trying to test this with two windows in Google Chrome, and I'm not sure if that's contributing to the issue. Maybe I need two separate machines to really work on this scenario.

Thoughts?

Socket.IO over Node.js & RTCMultiConnection-1.3

I cannot seem to get Socket.IO & RTCMultiConnection-1.3 playing together, maybe for the same reasons that caused #54 to be opened. You seem to know that these don't work together and suggest an upgrade to 1.4 (#54 (comment)), but at the moment this is not an option. Do you have any clues on how to make 1.3 work with Socket.IO?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.