📌
먼저 이전 로직에서 큰 오류가 발생하여 해당로직을 재수정 하게 되었습니다 ㅠㅠ
바로 signailng에서 오류가 생겨버렸는데요..
상대방의 stream을 읽어오지 못하는 오류가 생겨버렸습니다...
됐다 안됐다 하는 오류라... 미처 발견하지 못했었네요 😂
이제라도 발견해서... 수정하였습니다!
function createPeerConnection(
socketID,
socket,
peerConnectionLocalStream,
userNickName,
) {
const pc = new RTCPeerConnection({
iceServers: [
{
urls: 'stun:stun.l.google.com:19302',
},
],
});
// add pc to peerConnections object
const keyName = socketID;
pcs = { ...pcs, [`${keyName}`]: pc };
pc.onicecandidate = (e) => {
if (e.candidate) {
socket.send(
JSON.stringify({
type: 'candidate',
candidate: e.candidate,
receiver: socketID,
roomId: param.roomId,
}),
);
}
};
pc.oniceconnectionstatechange = (e) => {
// console.log(e);
};
// eslint-disable-next-line no-unused-expressions
if (userNickName === sessionStorage.getItem('owner')) {
setUsers((oldUsers) => [
...oldUsers,
{
id: socketID,
stream: null,
nickName: userNickName,
isCameraOn: false,
isMyTurn: false,
isOwner: true,
},
]);
} else {
setUsers((oldUsers) => [
...oldUsers,
{
id: socketID,
stream: null,
nickName: userNickName,
isCameraOn: false,
isMyTurn: false,
isOwner: false,
},
]);
}
pc.ontrack = (e) => {
setUsers((oldUsers) => oldUsers.filter((user) => user.id !== socketID));
// eslint-disable-next-line no-unused-expressions
if (userNickName === sessionStorage.getItem('owner')) {
setUsers((oldUsers) => [
...oldUsers,
{
id: socketID,
stream: e.streams[0],
nickName: userNickName,
isCameraOn: true,
isMyTurn: false,
isOwner: true,
},
]);
} else {
setUsers((oldUsers) => [
...oldUsers,
{
id: socketID,
stream: e.streams[0],
nickName: userNickName,
isCameraOn: true,
isMyTurn: false,
isOwner: false,
},
]);
}
};
try {
if (peerConnectionLocalStream) {
peerConnectionLocalStream.getTracks().forEach((track) => {
pc.addTrack(track, peerConnectionLocalStream);
});
} else {
console.log('no local stream');
}
} catch (error) {
console.log(error);
}
return pc;
}
// end WebRTC createPeerConnection method for using WebRTC, section
☝
왜 owner변수의 값을 참조하지 못하였는지는 아직도 잘... 이해가 안가지만 어찌저찌 오류를 잘 잡아냈습니다!!