Javascript 带peerJS的多方视频会议

我用peerJS尝试了webRTC视频会议，并成功地进行了一对一的会议，我需要一些帮助来推进多方视频会议，这里我试图解释我做了什么，请从我开始的地方提供帮助

我在这里发布了我的完整代码，这样任何人都可以通过修改一些信息来使用

强度

Alice登录并呼叫Bob

鲍勃加入艾丽丝的电话

Alice呼叫Carole（使用添加呼叫按钮）

卡罗尔加入艾丽丝的通话

在Alice、Bob和Carole之间创建会议（使用“加入呼叫”按钮）

取得

Alice登录并呼叫Bob

鲍勃加入艾丽丝的电话

爱丽丝打电话给卡罗尔

卡罗尔和爱丽丝在一起

mycase

• 注册并创建了Alice
• 爱丽丝登录。使用导航转到呼叫
• 使用“添加联系人”创建Bob和Carole
• 去电话簿打电话给鲍勃
• 鲍勃加入了爱丽丝的行列
• Alice用add call给Carole打了另一个电话
• 卡罗尔加入了爱丽丝的行列
• 艾丽丝有鲍勃和卡罗尔，鲍勃和卡罗尔彼此思念
• 然而要合并他们的溪流

待定需要帮助

创建Alice、Bob和Carole之间的会议 当我点击加入会议时，鲍勃和卡罗尔也应该有爱丽丝

如何在Alice、Bob和Carole之间进行会议

/*-----------------
indexedDB
------------------*/
var iDB；
const openiDB=indexedDB.open（'webRTC'，1）
openiDB.onupgradeneeded=函数（）{
iDB=openiDB.result
如果（！iDB.objectStoreNames.contains（'contacts'））{
iDB.createObjectStore（'contacts'，{keyPath:'mobile'，unique:true}）
}
如果（！iDB.objectStoreNames.contains（'callLog'））{
createObjectStore（'callLog'，{keyPath:'id'，autoIncrement:true}）
}
如果（！iDB.objectStoreNames.contains（'chatLog'））{
iDB.createObjectStore（'chatLog'，{keyPath:'mobile'}）
}
}
openiDB.onsuccess=函数（）{
iDB=openiDB.result
}
openiDB.onerror=函数（）{
console.log（openiDB.error）
}
/*-----------------
jQuery
------------------*/
$（文档）.ready（函数（）{
/*-----------------
功能
------------------*/
函数gIndex（）{
$（“正文”）。附加(
$（“”）文本（“2020年版权归西坎达尔所有”）
)
}
函数uIndex（）{
$（“main”）.empty（）.append(
$（“”）.attr（'class'，'error'），
$（“”）.attr（'class'，'welCome'）。追加(
$（“”）.attr（'class'，'aH2'）.text（“Hello”+user.fName），
$（“”）.attr（'class'，'msg'）
),
$（“”）。附加(
$（“”）.attr（{'class'：'navIcon'，'id'：'meetings'}）.text（“meetings”），
$（“”）.attr（{'class'：'navIcon'，'id'：'calls'}）.text（“calls”），
$（“”）.attr（{'id'：'logo'}）.text（“HOME”），
$（“”）.attr（{'class'：'navIcon'，'id'：'chats'}）.text（“chats”），
$（“”）.attr（{'class'：'navIcon'，'id'：'settings'}）.text（“菜单”）
),
$（“”）.attr（'class'，'modal'）.append(
$（“”）.attr（'class'，'mClose'）.text（“X”），
$（“”）.attr（'class'，'mWrap'）。追加(
$（“”）.attr（'class'，'contacts'）。追加(
$（“”）.attr（'class'，'formContact'），
$（“”）.attr（'class'，'showContacts'））
),
$（“”）.attr（'class'，'players'）.append(
$（“”）.attr（'class'，'row'）.append(
$（“”）.attr（{'controls'：false，'id'：'lCam'，'preload'：'none}）
),
$（“”）.attr（'class'，'row'），
$（“”）.attr（'class'，'row2'）。追加(
$（“”）.attr（'id'，'aCall'）.text（“添加”），
$（“”）.attr（'id'，'jCall'）.text（“JOIN”）.prop（'disabled'，true），
$（“”）.attr（'id'，'eCall'）.text（“结束”）
)
)
),
),
$（“”）.attr（'class'，'iScreen'）.append（）
)
$（'.modal、.contacts、.players、.iScreen、.error'）.hide（）
}
功能lCamCheck（cT、iCall）{
设lCam=$（“#lCam”）[0]
开关（cT）{
“传入”案例：{
开关（lCam.srcObject）{
大小写为空：{
navigator.mediaDevices.getUserMedia（约束）。然后（流=>{
lCam.srcObject=流；
iCall.应答（流）
lCam.play（）
}).catch（错误=>console.error（错误））
打破
}
默认值：{
iCall.answer（lCam.srcObject）
打破
}
}
打破
}
“传出”案例：{
开关（lCam.srcObject）{
大小写为空：{
navigator.mediaDevices.getUserMedia（约束）。然后（流=>{
lCam.srcObject=流；
let outGoing=socket.call（iCall，stream）
lCam.play（）
传出.on（'stream'，rStream=>{
rCamCheck（iCall、rStream）
$（“按钮[值='”+iCall+“]”）.prop（'disabled'，true）
$（“.players”）.show（）
}，err=>console.error（err））
addLog（iCall，'outgoing'）
}).catch（错误=>console.error（错误））
打破
}
默认值：{
let outGoing=socket.call（iCall，lCam.srcObject）
lCam.play（）
传出.on（'stream'，rStream=>{
var localStream;
var remoteStream = {};

navigator.medisDevices.getUserMedia({video: true, audio: true}).then((stream) =>{
    localStream = stream;
    
    //Plays it on your video
    $("#local-video").prop("srcObject", localStream);
});

peer.on("call", (call) => {
    call.answer(localStream);
    call.on("stream", (stream) => { //here's where you get the stream
        remoteStream[call.peer] = stream; //Update your record. 
        
        $("#video-" + call.peeer).remove(); //Remove remote video if exists before
        
        $("#video-list").append("<video id='video-"+ call.peeer +"' autoplay></video>"); //Create new video element
        $("#video-"+ call.peeer).prop("srcObject", stream); //Put stream to the video
    });
});

//You have you contacts in var contacts

contacts.forEach((x, y) => {
    call = peer.call(x.peerId, localStream);
    
    call.on("stream", () => {
        remoteStream[call.peer] = stream; //Update your record. 
        
        $("#video-" + call.peeer).remove(); //Remove remote video if exists before
        
        $("#video-list").append("<video id='video-"+ call.peeer +"' autoplay></video>"); //Create new video element
        $("#video-"+ call.peeer).prop("srcObject", stream); //Put stream to the video
    });
});