Javascript 带有php后端的simpleWebRTC

Javascript 带有php后端的simpleWebRTC,javascript,php,jquery,webrtc,Javascript,Php,Jquery,Webrtc,我使用simpleWebRTC和xhr来实现特殊的多用户视频聊天(无音频) 简而言之,我的主要问题是:我无法将php中的用户名附加到JS中的正确视频中 在我的问题上,我会的 1.解释我做了什么,以及我目前的问题是什么 2.如果我目前的路线是不可能的,那么我会征求关于我另一个行动路线的建议:-)-我的知识是JS和PHP| 多用户视频允许选择几个用户,并以单向连接方式查看他们。 假设我们有用户A、B、C、D 例如,用户A选择查看用户B、C、D,而用户B仅选择查看用户C和D。。。。等等 在simple

我使用simpleWebRTC和xhr来实现特殊的多用户视频聊天(无音频) 简而言之,我的主要问题是:我无法将php中的用户名附加到JS中的正确视频中

在我的问题上,我会的 1.解释我做了什么,以及我目前的问题是什么 2.如果我目前的路线是不可能的,那么我会征求关于我另一个行动路线的建议:-)-我的知识是JS和PHP|

多用户视频允许选择几个用户,并以单向连接方式查看他们。 假设我们有用户A、B、C、D 例如,用户A选择查看用户B、C、D,而用户B仅选择查看用户C和D。。。。等等

在simpleWebRTC中,我想到了两种行动方案 A.为所有参与者提供一个房间,然后对其进行筛选(未成功,因为我无法将正确的用户名附加到每个视频-以筛选出它们) 2.相反,我创建了一个房间(用户名为-email,id为),让每个用户连接到相应的房间

在代码的第一部分中,我有一个XHR,它提取了用户希望订阅这些视频的人的列表(即:选择观看)

函数afterRoomDefined(myRoom,remoteRoomArray)是在从MySQl检索到该特定用户选择注册的人员列表后调用的

在这个函数中,我现在尝试实现WebRTC:

function afterRoomDefined(myRoom, remoteRoom){


console.log('remote room name: '+ remoteRoom + ' type: '+ $.type(remoteRoom));


remoteRoom = JSON.stringify(remoteRoom);
console.log('isArray '+$.isArray(remoteRoom));

//Create our WebRTC connection
var webrtc = new SimpleWebRTC({
    url:'https://signaling.simplewebrtc.com:443',
    //the element that will hold the local video
    localVideoEl: 'localVideo',
    //the element that will hold remote videos
    //remoteVideosEl: 'remotes',
    remoteVideosEl: '',
    autoRequestMedia: true,
    media: {
            video: true,
            audio: false
        },

});


webrtc.mute();

// a peer video has been added

var i = 0;

//When it's ready and we have a room from the URL, join the call
webrtc.on('readyToCall', function(peer){

//each user first creates a room for himself - so other users could connect to
if(myRoom) webrtc.joinRoom(myRoom);

    //here a room is created for every person the user subscribed to. each person created a room with his own username (when he opened this page in his browser) - in the line above. so now i open rooms with the same names - so the users will see each other (two ways now)
    for(var b=0; b<remoteRoom.museUsername.length; b++){
        console.log('remoteRoom loop - separate values: '+ remoteRoom.museUsername[b]);
        if(remoteRoom.museUsername[b]) webrtc.joinRoom(remoteRoom.museUsername[b]);
    }
});


// a peer video has been added
webrtc.on('videoAdded', function (video, peer) {

var remotes = document.getElementById('remotes');
if (remotes) {
    var container = document.createElement('div');
    container.className = 'videoContainer'+i;

    $(container).attr('data-username', remoteRoom.museUsername[i]);
    i++;


    container.id = 'container_' + webrtc.getDomId(peer);
    container.appendChild(video);

    // suppress contextmenu
    video.oncontextmenu = function () { return false; };

    remotes.appendChild(container);

    //this is to remove the other party video - if a user only subscribed to another user - the other user is not
    //$('#remotes div:not[data-username]').css('border', 'red 5px solid');
   $('#remotes div:not[data-username]').remove();
}
i=i+1;
});

webrtc.on('videoRemoved', function (video, peer) {

var remotes = document.getElementById('remotes');
var el = document.getElementById(peer ? 'container_' + webrtc.getDomId(peer) : 'localScreenContainer');

$('#remotes div').css('border', '#F4171A 2px solid');
if (remotes && el) {
    remotes.removeChild(el);
}
});
b。例如,当用户A向用户B注册时…-如果用户C订阅了用户A,他也会看到用户B 主要问题可能是: C我从未真正能够将用户名附加到下面的正确视频:

 webrtc.on('videoAdded',....
 $(container).attr('data-username', remoteRoom.museUsername[i]);...
在主块代码中。 我曾经

要查找没有用户名和kick的所有视频(如果用户A订阅了用户B,则复制和冻结的视频+视频的另一面,反之亦然,因此用户B将看不到用户A,因此在上述说明中C将看不到),请将其删除-但用户名本身未按正确顺序附加到正确的子级(当有人刷新页面时,订单就会混乱

  • 我走对方向了吗? 我看了pubNub、xirsys、firebase和其他一些解决方案 (谷歌appengine——需要java知识、html5Rocks、easyRTC、signalMaster(没有关于如何使用的适当解释)——但它们似乎都需要node.js)
  • 我当前的操作模式(php和XHR)有效吗? 如果不是的话,另一种解决方案将相对简单和合理。 我开始浏览太多的api,现在感到困惑


    谢谢:-)

    很难看出到底出了什么问题,因为您在这里似乎面临多个问题,包括webRTC的一般问题和DOM插入/删除问题

    如果您正在寻找使用PubNub的webRTC解决方案,请查看:

    以及您可以尝试的演示:

    还有,看看


    很难确切地看出哪里出了问题,因为您在这里似乎面临多个问题,包括webRTC的一般问题和DOM插入/删除问题

    如果您正在寻找使用PubNub的webRTC解决方案,请查看:

    以及您可以尝试的演示:

    还有,看看


    我怀疑我需要一个合适的信号机制-可能使用firebase或pubnub实现这个目的?而使用我自己的php作为备份…?我怀疑我需要一个合适的信号机制-可能使用firebase或pubnub实现这个目的?可能使用我自己的php作为备份…?我怀疑我需要一个合适的信号机制-可能使用firebase或pubnub实现这个目的那是什么?在使用我自己的php作为支持的情况下…?谢谢,我设法解决了这个问题-现在剩下的问题是:1.我需要一个信令服务器-最好使用simpleWebRTC signalmaster(或与simpleWebRTC兼容的东西)2.stun和turn服务器可以提供类似的东西吗?:-)@NamiNam你能发布你的解决方案吗?谢谢,我设法解决了这个问题-现在剩下的问题是:1。我需要一个信令服务器-最好使用simpleWebRTC signalmaster(或与simpleWebRTC兼容的东西)2。眩晕和翻转服务器pubNub可以提供类似的服务吗?:-)@NamiNam你能发布你的解决方案吗?谢谢,我设法解决了这个问题-现在剩下的问题是:1。我需要一个信令服务器-最好使用simpleWebRTC signalmaster(或与simpleWebRTC兼容的东西)2。眩晕和翻转服务器pubNub可以提供类似的服务吗?:-)@NamiNam你能发布你的解决方案吗?
    webrtc.on('videoRemoved'...
    
     webrtc.on('videoAdded',....
     $(container).attr('data-username', remoteRoom.museUsername[i]);...
    
     $('#remotes div:not[data-username]').remove();