WebRT C & socket.io: onicecandidate не сработал для трансляции одного-многих видео - PullRequest
0 голосов
/ 19 апреля 2020

Я пытался сделать трансляцию видео «один ко многим», используя WebRTC и socket.io. После вызова createAnswer событие onicecandidate не вызывается. Это правильный путь для соединения нескольких пиров? и как транслировать по одному на несколько пользователей, используя node, socket.io и react.

Можно ли сделать трансляцию видео один-ко-многим с общим экраном?

     componentDidMount() {
        this.setState({ clientId: this.props.userId, username: this.props.username }, () => {
            const config = { audio: true, video: true };
            if(navigator.mediaDevices.getUserMedia) {
                navigator.mediaDevices.getUserMedia(config)
                    .then(this.getUserMediaSuccess)
                    .then(this.connectSocket())
                }
            }
        )
    }
    getUserMediaSuccess = (stream) => {
        console.log(stream);
        localStream = stream;
        this.setState({ localSrc: stream })
    }
    gotRemoteStream = (stream, id) => {
        console.log(stream, id)
        var video  = document.createElement('video'),
            div    = document.createElement('div')
        video.setAttribute('data-socket', id);
        video.srcObject = stream;
        video.muted = true;
        div.appendChild(video);      
        document.querySelector('.videos').appendChild(div);      
    }
    mapUsers = (data) => {
        data.users.forEach(async (user) => {
            if(!connections[user.id]){
                connections[user.id] = new RTCPeerConnection(PC_CONFIG);
                connections[user.id].onicecandidate = event => {
                    if(event.candidate != null) {
                        this.props.socket.emit('call', { 
                            candidate: event.candidate, 
                            socket_id: user.id, 
                            room: this.props.roomID 
                        });
                    }
                }
                connections[user.id].ontrack = event => {
                    let stream = event.streams[0];
                    stream.getTracks().forEach((track) => {
                        connections[user.id].addTrack(track, stream);
                    });
                    this.gotRemoteStream(stream, user.id)
                }    
            }
        });
        //Create an offer to connect with your local description
        if(data.users.length >= 2){
            connections[data.id].createOffer().then(async (description) => {
                console.log(description);
                await connections[this.props.socket.id].setLocalDescription(description)
                if(this.props.socket.id != data.id) {
                    await this.props.socket.emit('call',  { 
                        sdp: description, 
                        socket_id: data.id, 
                        room: this.props.roomID  
                    });
                }
            }).catch(e => console.log(e));     
        }
    }
    connectSocket() {
        this.props.socket
            .on('init', (data) => {
                this.mapUsers(data)
            })
            .on('call', async (data) => {
                if(data.socket_id !== this.props.socket.id) {
                    if(data.sdp && data.sdp.type == "offer"){            
                        const rtcSdp = new RTCSessionDescription(data.sdp);
                        connections[data.socket_id].setRemoteDescription(rtcSdp).then(async () => {                
                            if(data.sdp.type == 'offer') {
                                connections[data.socket_id].createAnswer().then(async (description) => {
                                    await connections[data.socket_id].setLocalDescription(description)
                                    this.props.socket.emit('call', { socket_id: data.socket_id, sdp: description, room: this.props.roomID, data: 'Poguthae....', username: this.props.username });
                                }).catch(e => console.log(e));
                            }
                        }).catch(e => console.log(e));
                    }
                    if(data.candidate){
                        await connections[data.socket_id].addIceCandidate(new RTCIceCandidate(data.candidate)).catch(e => console.log(e));
                    }                
                }
            })
            .emit('init', {
                username: this.props.username,
                userId: this.props.userId,
                room: this.props.roomID,
                socket_id: this.props.socket_id
            });
    }


...