准备阶段

前端

step1. 引入文件

在index.html文件中使用script标签引入peerJs

<script src="https://unpkg.com/peerjs@1.4.7/dist/peerjs.min.js"></script>

step2. 封装函数

将peer的初始化操作封装成函数，在页面加载的时候执行

let myPeerId;
//peer接受的第二个参数是后端的服务器地址与路径
myPeer = new window.Peer(undefined, {
        path: "/peerjs",
        host: "/",
        port: 3030
    })
    myPeer.on("open", id=>{
        //成功连接到PeerServer
        myPeerId = id
    })
    myPeer.on("call", call=>{
        call.answer(store.getState().localStream)
        call.on("stream", incomingStream=>{
            //获取新加入的用户的媒体流（incomingStream）
        })
    })

后端

以下是在express存在的情况下，新增peer

const {ExpressPeerServer} = require("peer")
const app = express()
const PORT = 3030

// 监听端口号启动服务器
const server = app.listen(PORT, ()=>{
    //...
})

// 使用ExpressPeerServer对象来创建peer服务器
const peerServer = ExpressPeerServer(server, {debug:true})
// 使用app.use设置中间件
app.use("/peerjs", peerServer)
// 监听端口号启动Peer服务器
peerServer.on("connection", client=>{
    //成功连接到Peerjs
})

创建房间

step1. 前端：点击按钮发送信息

通过 socket.emit 发送所需信息, username为自己的用户名， peerId为成功连接到PeerServer后得到的id值

    socket.emit("group-call-register",{
        username: store.getState().username,
        peerId: myPeerId
    }）

step2. 后端：处理房间信息并发送信息给所有用户

1.首先创建一个数组，用来存储房间的信息，当关闭房间时，把该房间的信息从数组中移除即可

2.每次创建房间时，都生成一个随机数作为房间的id,例如roomId

3.通过socket.join进入房间

4.通过io.sockets.emit("broadcast",{...})向所有用户发送存储房间信息的数组

socket.on("group-call-register", data=>{
        const roomId = uuidv4()
        socket.join(roomId)
        
        // 初始化房间信息，并添加到房间数组
        const newGroupCallRoom = {
            peerId: data.peerId,
            hostName: data.username,
            socketId: socket.id,
            roomId: roomId
        }
        groupCallRooms.push(newGroupCallRoom)
        
        io.sockets.emit("broadcast", {
            //这里是要发送给所有用户的信息
        })
    })

step3. 前端：接收信息

至此，创建房间成功，并且已经进入了房间。

socket.on("broadcast", data=>{
    //监听到服务器发给所有用户的信息以后，执行需要的操作
})

关闭房间

step1. 前端通过 socket.emit 发送关闭房间的通知

step2. 后端通过 socket.on 接收到通知后，将该房间的信息从房间数组中去除掉。并通过 socket.emit（“broadcast”,{...}）向所有用户发送通知

step3. 前端接收到通知后，执行想要的操作