peers / peerjs

Simple peer-to-peer with WebRTC.
https://peerjs.com
MIT License
12.48k stars 1.43k forks source link

I am getting this error.. Can someone help #896

Closed anonymous887 closed 2 years ago

anonymous887 commented 3 years ago

I am getting two errors

The connection to ws://localhost:3000/socket.io/?EIO=4&transport=websocket&sid=MZ-83rZca70hU-pAAAAG was interrupted while the page was loading.

Uncaught TypeError: video is null addVideoStream http://localhost:3000/client.js:54

http://localhost:3000/client.js:30 emit http://localhost:3000/peerjs.min.js:46 addStream http://localhost:3000/peerjs.min.js:58 _addStreamToMediaConnection http://localhost:3000/peerjs.min.js:54 ontrack http://localhost:3000/peerjs.min.js:54 Also, the video is not loading on the second tab when i go to the same link again Please help client.js ``` const socket = io("/"); const myVideo = document.createElement("video"); myVideo.muted = true; const videoGrid = document.getElementById("video-grid"); let myVideoStream; var peer = new Peer(undefined, { path: "/peerjs", host: "/", port: "3000", }); navigator.mediaDevices .getUserMedia({ video: true, audio: false, }) .then((stream) => { myVideoStream = stream; addVideoStream(myVideo, stream); peer.on("call", (call) => { call.answer(stream); const video = document.getElementById("video"); call.on("stream", (userVideoStream) => { addVideoStream(video, userVideoStream); }); }); socket.on("user-connected", (userId) => { connectToNewUser(userId, stream); }); }); // Peer peer.on("open", (id) => { socket.emit("join-room", ROOM_ID, id); }); const connectToNewUser = (userId, stream) => { const call = peer.call(userId, stream); const video = document.createElement("video"); call.on("stream", (useVideoStream) => { addVideoStream(video, useVideoStream); }); }; const addVideoStream = (video, stream) => { video.srcObject = stream; video.addEventListener("loadedmetadata", () => { video.play(); }); videoGrid.append(video); let child = videoGrid.childElementCount; console.log("Child of VideoGrid: ", child); }; ``` server.js ``` const express = require("express"); const app = express(); const server = require("http").Server(app); const io = require("socket.io")(server); const { v4: uuidV4 } = require("uuid"); const { ExpressPeerServer } = require("peer"); const peerServer = ExpressPeerServer(server, { debug: true, }); const PORT = process.env.PORT || 3000; app.use("/peerjs", peerServer); app.set("view engine", "ejs"); app.use(express.static("public")); app.get("/", (req, res) => { res.redirect(`/${uuidV4()}`); }); app.get("/:room", (req, res) => { res.render("room", { roomId: req.params.room }); }); io.on("connection", (socket) => { socket.on("join-room", (roomId, userId) => { socket.join(roomId); socket.broadcast.to(roomId).emit("user-connected", userId); }); }); server.listen(PORT, () => { console.log("Server started at PORT : ", PORT); }); ```
afrokick commented 2 years ago

Sorry but it is not PeerJS issue. Check your logic, seems like 'video' tag doesn't exists at the page. I'll close the issue.