带有 webRTC（socket.io）的 node.js 上的视频聊天应用程序在 localhost 上运行良好，但在网络上出现错误答案

【问题标题】：video chat application on node.js with webRTC( socket.io) works fine on localhost but gives error on network带有 webRTC（socket.io）的 node.js 上的视频聊天应用程序在 localhost 上运行良好，但在网络上出现错误
【发布时间】：2021-02-23 12:58:23
【问题描述】：

我正在使用 WebRTC(socket.io) 在 node.js 上制作视频聊天应用程序。此应用程序在 localhost 上运行良好，但在使用我的 IP 地址在我的网络上运行时出错。另外，我在 Heroku 上尝试过，但错误仍然相同

只有我的服务器顶部看起来像

   const express = require("express");
    const socket = require("socket.io");
    const app = express();
    
    //Starts the server
    
    let server = app.listen(process.env.PORT||4000, function () {
      console.log("Server is running");
    });
    
    app.use(express.static(__dirname+"/public"));
    
    //Upgrades the server to accept websockets.
    
    let io = socket(server);
    
    //Triggered when a client is connected.
    
    io.on("connection", function (socket) {
      console.log("User Connected :" + socket.id);

客户端的顶部是

let socket = io.connect("//192.168.1.73:4000");
let divVideoChatLobby = document.getElementById("video-chat-lobby");
let divVideoChat = document.getElementById("video-chat-room");
let joinButton = document.getElementById("join");
let userVideo = document.getElementById("user-video");
let peerVideo = document.getElementById("peer-video");
let roomInput = document.getElementById("roomName");
let roomName;
let creator = false;
let rtcPeerConnection;
let userStream;

// Contains the stun server URL we will be using.
let iceServers = {
  iceServers: [
    { urls: "stun:stun.services.mozilla.com"},
    { urls: "stun:stun.l.google.com:19302"},
  ],
};

在 192.168.1.73:4000 上运行的服务器上运行时出错

chat.js:37 Uncaught TypeError: Cannot read property 'getUserMedia' of undefined

    at f.<anonymous> (chat.js:37)
    at f.r.emit (socket.io-3.0.1.min.js:6)
    at f.value (socket.io-3.0.1.min.js:6)
    at f.value (socket.io-3.0.1.min.js:6)
    at f.value (socket.io-3.0.1.min.js:6)
    at b.<anonymous> (socket.io-3.0.1.min.js:6)
    at b.r.emit (socket.io-3.0.1.min.js:6)
    at b.value (socket.io-3.0.1.min.js:6)
    at n.<anonymous> (socket.io-3.0.1.min.js:6)
    at n.r.emit (socket.io-3.0.1.min.js:6)

(anonymous) @ chat.js:37
r.emit @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
(anonymous) @ socket.io-3.0.1.min.js:6
r.emit @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
(anonymous) @ socket.io-3.0.1.min.js:6
r.emit @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
(anonymous) @ socket.io-3.0.1.min.js:6
r.emit @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
(anonymous) @ socket.io-3.0.1.min.js:6
r.emit @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
value @ socket.io-3.0.1.min.js:6
ws.onmessage @ socket.io-3.0.1.min.js:6

关于 Heroku 的错误看起来像

在 Chrome 上获取 https://projectnepflix.herokuapp.com:4000/socket.io/?EIO=4&transport=polling&t=NVEwhoG net::ERR_CONNECTION_TIMED_OUT

git repo 示例：https://github.com/innovatoraakash/nepflix

【问题讨论】：

您的错误是：无法读取属性“getUserMedia”，但您没有提供实际调用 getUserMedia 的代码。请分享执行此操作的部分，以便我了解它发生的原因。
github.com/innovatoraakash/nepflix 这里是仓库。客户公开

标签： node.js socket.io webrtc streaming chat

【解决方案1】：

我之前也遇到过同样的问题。

getUserMedia documentation 的此注释描述了您在服务器上出现问题的原因：

注意：如果当前文档没有安全加载，navigator.mediaDevices 将是未定义的，并且您不能使用 getUserMedia()。有关此问题以及与使用 getUserMedia() 相关的其他安全问题的更多信息，请参阅安全性

这意味着，您已经使用 HTTPS 运行您的应用程序（除非您是本地主机），否则 navigator.mediaDevices 将如上所述未定义，因此当您尝试调用 navigator.mediaDevices.getUserMedia 时它会崩溃。

【讨论】：

【解决方案2】：

在我的网络上使我的公共 IP HTTPS 很困难，所以我更改了

let socket = io.connect("//192.168.1.73:4000");

符合

var socket = io.connect(window.location.href);

这是 Heroku 出错的原因，我在 Heroku 上进行了很好的测试，因为它在 https 上运行，所以 navigator.mediaDevices.getUserMedi 不会崩溃

【讨论】：