Skip to content

GitLab

Commit e8f19465 authored by Kim, Chaerin's avatar Kim, Chaerin
Browse files

처음부터 다시 클라이언트

parent 2bf918de
Show whitespace changes
Inline Side-by-side
client/src/components/Room/Screen.js
View file @ e8f19465
...@@ -29,102 +29,108 @@ const Screen = () => { ...@@ -29,102 +29,108 @@ const Screen = () => {
}, },
], ],
}; };
useEffect(() => { useEffect(() => {
let newSocket = io.connect("http://localhost:8080"); let newSocket = io.connect("/");
let localStream; newSocket.emit("connected", "채린이");
// console.log("newSocket", newSocket.id); newSocket.on("toclient", (data) => {
// console.log(data.msg);
newSocket.on("userEnter", (data) => {
console.log(data);
createReceivePC(data.id, newSocket);
});
newSocket.on("allUsers", (data) => {
let len = data.users.length;
for (let i = 0; i < len; i++) {
createReceivePC(data.users[i].id, newSocket);
}
});
newSocket.on("userExit", (data) => {
receivePCs[data.id].close();
delete receivePCs[data.id];
setUsers((users) => users.filter((user) => user.id !== data.id));
});
newSocket.on("getSenderAnswer", async (data) => {
try {
console.log("get sender answer");
console.log(data.sdp);
await sendPC.setRemoteDescription(new RTCSessionDescription(data.sdp));
} catch (error) {
console.log(error);
}
});
newSocket.on("getSenderCandidate", async (data) => {
try {
console.log("get sender candidate");
if (!data.candidate) return;
sendPC.addIceCandidate(new RTCIceCandidate(data.candidate));
console.log("candidate add success");
} catch (error) {
console.log(error);
}
});
newSocket.on("getReceiverAnswer", async (data) => {
try {
console.log(`get socketID(${data.id})'s answer`);
let pc = receivePCs[data.id];
await pc.setRemoteDescription(data.sdp);
console.log(`socketID(${data.id})'s set remote sdp success`);
} catch (error) {
console.log(error);
}
});
newSocket.on("getReceiverCandidate", async (data) => {
try {
console.log(data);
console.log(`get socketID(${data.id})'s candidate`);
let pc = receivePCs[data.id];
if (!data.candidate) return;
pc.addIceCandidate(new RTCIceCandidate(data.candidate));
console.log(`socketID(${data.id})'s candidate add success`);
} catch (error) {
console.log(error);
}
});
setSocket(newSocket);
navigator.mediaDevices
.getUserMedia({
audio: true,
video: {
width: 375,
height: 260,
},
})
.then((stream) => {
if (localVideoRef.current) localVideoRef.current.srcObject = stream;
localStream = stream;
sendPC = createSenderPeerConnection(newSocket, localStream);
createSenderOffer(newSocket);
newSocket.emit("joinRoom", {
id: newSocket.id,
roomID: roomId,
});
})
.catch((error) => {
console.log(`getUserMedia error: ${error}`);
}); });
}, []); }, []);
// useEffect(() => {
// let newSocket = io.connect("http://localhost:8080");
// let localStream;
// // console.log("newSocket", newSocket.id);
// //
// newSocket.on("userEnter", (data) => {
// console.log(data);
// createReceivePC(data.id, newSocket);
// });
// newSocket.on("allUsers", (data) => {
// let len = data.users.length;
// for (let i = 0; i < len; i++) {
// createReceivePC(data.users[i].id, newSocket);
// }
// });
// newSocket.on("userExit", (data) => {
// receivePCs[data.id].close();
// delete receivePCs[data.id];
// setUsers((users) => users.filter((user) => user.id !== data.id));
// });
// newSocket.on("getSenderAnswer", async (data) => {
// try {
// console.log("get sender answer");
// console.log(data.sdp);
// await sendPC.setRemoteDescription(new RTCSessionDescription(data.sdp));
// } catch (error) {
// console.log(error);
// }
// });
// newSocket.on("getSenderCandidate", async (data) => {
// try {
// console.log("get sender candidate");
// if (!data.candidate) return;
// sendPC.addIceCandidate(new RTCIceCandidate(data.candidate));
// console.log("candidate add success");
// } catch (error) {
// console.log(error);
// }
// });
// newSocket.on("getReceiverAnswer", async (data) => {
// try {
// console.log(`get socketID(${data.id})'s answer`);
// let pc = receivePCs[data.id];
// await pc.setRemoteDescription(data.sdp);
// console.log(`socketID(${data.id})'s set remote sdp success`);
// } catch (error) {
// console.log(error);
// }
// });
// newSocket.on("getReceiverCandidate", async (data) => {
// try {
// console.log(data);
// console.log(`get socketID(${data.id})'s candidate`);
// let pc = receivePCs[data.id];
// if (!data.candidate) return;
// pc.addIceCandidate(new RTCIceCandidate(data.candidate));
// console.log(`socketID(${data.id})'s candidate add success`);
// } catch (error) {
// console.log(error);
// }
// });
// setSocket(newSocket);
// navigator.mediaDevices
// .getUserMedia({
// audio: true,
// video: {
// width: 375,
// height: 260,
// },
// })
// .then((stream) => {
// if (localVideoRef.current) localVideoRef.current.srcObject = stream;
// localStream = stream;
// sendPC = createSenderPeerConnection(newSocket, localStream);
// createSenderOffer(newSocket);
// newSocket.emit("joinRoom", {
// id: newSocket.id,
// roomID: roomId,
// });
// })
// .catch((error) => {
// console.log(`getUserMedia error: ${error}`);
// });
// }, []);
const createReceivePC = (id, newSocket) => { const createReceivePC = (id, newSocket) => {
try { try {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment