为什么videochat在websockets上不起作用？

Question

我正在WebSockets上进行视频聊天流项目。 它在本地主机中正常工作。 但是，当我从服务器连接多个设备时，出现错误： “与'wss：//tensy.org/sockjs-node/075/yxzmuhgj/websocket'的websocket.js：7 WebSocket连接失败：WebSocket握手期间出错：意外的响应代码：400 WebSocketBrowserDriver @ websocket.js：7“

我正在使用NGINX。 也许是这个问题。 但是websocket连接p2p。

import React from "react";
import openSocket from 'socket.io-client';
import {server, client} from '../../params'
import $ from 'jquery';


class Space extends React.Component {
    constructor (props) {
                super(props)
                this.state = {
                        responce: []
                }
        }

        componentWillMount() {
                let _position = document.location.pathname.split('/').pop();
        console.log(_position);

        // WebRTC
        let namespace = 'space';
        const socket = openSocket('https://tensy.org/' + namespace);
        const peer = new RTCPeerConnection();

        let yourDescription;
        let otherDescription;
        let yourCandidate;
        let newCandidate;
        let candidatee;

        function addcandidate(data) {
                console.log('Candidate', data);

                setTimeout(function() {
                        if (candidatee) {
                                console.log('!', candidatee);
                                peer.addIceCandidate(JSON.parse(candidatee));
                        } else {
                                addcandidate(candidatee);
                        }
                }, 100);
       //client
        if(_position === 'student') {
            peer.onicecandidate = e => {
                if(e.candidate) {
                        yourCandidate = e.candidate;
                        console.log('cand1', yourCandidate);
                        socket.emit('cand1', {description: JSON.stringify(yourCandidate)});
                }
            }

            navigator.mediaDevices.getUserMedia({ video:true })
            .then(stream => {
                document.getElementById("local").srcObject = stream;
                peer.addStream(stream);
                return peer.createOffer();
            })
            .then(offer => {
                peer.setLocalDescription(new RTCSessionDescription(offer));
                yourDescription = peer.localDescription;
                socket.emit('call', {description: JSON.stringify(yourDescription)});
            })

            peer.ontrack = e => {
                document.getElementById("remote").srcObject = e.streams[0];
            }

            $(document).ready(function() {
                socket.on('answer', function(mes) {
                        console.log('Client 1', mes);

                        peer.setRemoteDescription(JSON.parse(mes['description']))
                        .then(() => addcandidate(candidatee))
                });

                socket.on('cand2', function(mes) {
                        console.log('Client cand 1', mes);

                        candidatee = mes['description'];
                });
            });
      } else {
           //candidate
            peer.onicecandidate = e => {
                if(e.candidate) {
                        console.log('cand2', yourCandidate);
                        yourCandidate = e.candidate;
                        socket.emit('cand2', {description: JSON.stringify(yourCandidate)});
                }
            }

            $(document).ready(function() {
                socket.on('call', function(mes) {
                        console.log('Client 2', mes);

                        navigator.mediaDevices.getUserMedia({ video:true })
                        .then(stream => {
                                document.getElementById("local").srcObject = stream;
                                peer.addStream(stream);
                                peer.setRemoteDescription(JSON.parse(mes['description']));
                        })
                        .then(() => addcandidate(candidatee)) // console.log('!!!', candidatee); addcandidate(candidatee);
                        .then(() => peer.createAnswer())
                        .then(answer => {
                                peer.setLocalDescription(new RTCSessionDescription(answer));
                                yourDescription = peer.localDescription;
                                socket.emit('answer', {description: JSON.stringify(yourDescription)});
                        })

                        peer.ontrack = e => {
                                document.getElementById("remote").srcObject = e.streams[0];
                        }

                });

                socket.on('cand1', function(mes) {
                        console.log('Client cand 2', mes);

                        candidatee = mes['description'];
                });
            });
        }
        }
    render() {
       return (
            <div id="space">
                <div className="video-control">
                    <div className="icon">
                        <i className="fas fa-sign-out-alt"></i>
                    </div>
                    <div className="icon">
                        <i className="fas fa-comment"></i>
                    </div>
                    <div className="icon">
                        <i className="fas fa-redo"></i>
                    </div>
                </div>
                <div className="video-feedback">
                    <div className="icon">
                        <i className="far fa-grin-beam-sweat"></i>
                    </div>
                    <div className="icon">
                        <i className="far fa-smile"></i>
                    </div>
                    <div className="icon">
                        <i className="far fa-smile-beam"></i>
                    </div>
                    <div className="icon">
                        <i className="far fa-grin"></i>
                    </div>
                    <div className="icon">
                        <i className="far fa-laugh"></i>
                    </div>
                </div>
                <video id="local" autoPlay></video>
                <video id="remote" autoPlay></video>
            </div>
        );
    }
};

export default Space;