Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
bora-it
Commits
dd4deb05
Commit
dd4deb05
authored
Jul 28, 2021
by
Kim, Chaerin
Browse files
영상 연결 완료
parent
d08af57f
Changes
2
Hide whitespace changes
Inline
Side-by-side
client/src/components/Room/Screen.js
View file @
dd4deb05
...
...
@@ -38,10 +38,7 @@ const Screen = () => {
},
});
let
localStream
;
// console.log("newSocket", newSocket.id);
//
newSocket
.
on
(
"
userEnter
"
,
(
data
)
=>
{
console
.
log
(
data
);
createReceivePC
(
data
.
id
,
newSocket
);
});
...
...
@@ -61,7 +58,6 @@ const Screen = () => {
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
);
...
...
@@ -92,7 +88,6 @@ const Screen = () => {
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
;
...
...
@@ -149,7 +144,6 @@ const Screen = () => {
});
console
.
log
(
"
create sender offer success
"
);
await
sendPC
.
setLocalDescription
(
new
RTCSessionDescription
(
sdp
));
console
.
log
(
sdp
,
"
안
"
,
newSocket
.
id
,
"
녕
"
,
roomId
);
newSocket
.
emit
(
"
senderOffer
"
,
{
sdp
,
...
...
@@ -169,7 +163,6 @@ const Screen = () => {
});
console
.
log
(
"
create receiver offer success
"
);
await
pc
.
setLocalDescription
(
new
RTCSessionDescription
(
sdp
));
console
.
log
(
sdp
,
newSocket
.
id
,
senderSocketID
,
roomId
);
newSocket
.
emit
(
"
receiverOffer
"
,
{
sdp
,
receiverSocketID
:
newSocket
.
id
,
...
...
@@ -255,6 +248,7 @@ const Screen = () => {
className
=
"
m-2 d-flex fw-bold text-center
"
style
=
{{
color
:
"
#4A4251
"
,
fontSize
:
"
20px
"
}}
>
{
console
.
log
(
users
)}
<
img
className
=
"
rounded-circle me-2
"
src
=
"
/cherry.jpg
"
...
...
@@ -275,6 +269,9 @@ const Screen = () => {
ref
=
{
localVideoRef
}
autoPlay
/>
{
/* {users.map((user, index) => {
return <Video key={index} stream={user.stream} />;
})} */
}
<
/div
>
<
/div
>
);
...
...
server/app.js
View file @
dd4deb05
...
...
@@ -24,13 +24,249 @@ app.use(cookieParser());
app
.
use
(
"
/api
"
,
mainRouter
);
let
receiverPCs
=
{};
let
senderPCs
=
{};
let
users
=
{};
let
socketToRoom
=
{};
const
pc_config
=
{
iceServers
:
[
// {
// urls: 'stun:[STUN_IP]:[PORT]',
// 'credentials': '[YOR CREDENTIALS]',
// 'username': '[USERNAME]'
// },
{
urls
:
"
stun:stun.l.google.com:19302
"
,
},
],
};
const
isIncluded
=
(
array
,
id
)
=>
{
let
len
=
array
.
length
;
for
(
let
i
=
0
;
i
<
len
;
i
++
)
{
if
(
array
[
i
].
id
===
id
)
return
true
;
}
return
false
;
};
const
createReceiverPeerConnection
=
(
socketID
,
socket
,
roomID
)
=>
{
let
pc
=
new
wrtc
.
RTCPeerConnection
(
pc_config
);
if
(
receiverPCs
[
socketID
])
receiverPCs
[
socketID
]
=
pc
;
else
receiverPCs
=
{
...
receiverPCs
,
[
socketID
]:
pc
};
pc
.
onicecandidate
=
(
e
)
=>
{
//console.log(`socketID: ${socketID}'s receiverPeerConnection icecandidate`);
socket
.
to
(
socketID
).
emit
(
"
getSenderCandidate
"
,
{
candidate
:
e
.
candidate
,
});
};
pc
.
oniceconnectionstatechange
=
(
e
)
=>
{
//console.log(e);
};
pc
.
ontrack
=
(
e
)
=>
{
if
(
users
[
roomID
])
{
if
(
!
isIncluded
(
users
[
roomID
],
socketID
))
{
users
[
roomID
].
push
({
id
:
socketID
,
stream
:
e
.
streams
[
0
],
});
}
else
return
;
}
else
{
users
[
roomID
]
=
[
{
id
:
socketID
,
stream
:
e
.
streams
[
0
],
},
];
}
socket
.
broadcast
.
to
(
roomID
).
emit
(
"
userEnter
"
,
{
id
:
socketID
});
};
return
pc
;
};
const
createSenderPeerConnection
=
(
receiverSocketID
,
senderSocketID
,
socket
,
roomID
)
=>
{
let
pc
=
new
wrtc
.
RTCPeerConnection
(
pc_config
);
if
(
senderPCs
[
senderSocketID
])
{
senderPCs
[
senderSocketID
].
filter
((
user
)
=>
user
.
id
!==
receiverSocketID
);
senderPCs
[
senderSocketID
].
push
({
id
:
receiverSocketID
,
pc
:
pc
});
}
else
senderPCs
=
{
...
senderPCs
,
[
senderSocketID
]:
[{
id
:
receiverSocketID
,
pc
:
pc
}],
};
pc
.
onicecandidate
=
(
e
)
=>
{
//console.log(`socketID: ${receiverSocketID}'s senderPeerConnection icecandidate`);
socket
.
to
(
receiverSocketID
).
emit
(
"
getReceiverCandidate
"
,
{
id
:
senderSocketID
,
candidate
:
e
.
candidate
,
});
};
pc
.
oniceconnectionstatechange
=
(
e
)
=>
{
//console.log(e);
};
const
sendUser
=
users
[
roomID
].
filter
((
user
)
=>
user
.
id
===
senderSocketID
);
sendUser
[
0
].
stream
.
getTracks
().
forEach
((
track
)
=>
{
pc
.
addTrack
(
track
,
sendUser
[
0
].
stream
);
});
return
pc
;
};
const
getOtherUsersInRoom
=
(
socketID
,
roomID
)
=>
{
let
allUsers
=
[];
if
(
!
users
[
roomID
])
return
allUsers
;
let
len
=
users
[
roomID
].
length
;
for
(
let
i
=
0
;
i
<
len
;
i
++
)
{
if
(
users
[
roomID
][
i
].
id
===
socketID
)
continue
;
allUsers
.
push
({
id
:
users
[
roomID
][
i
].
id
});
}
return
allUsers
;
};
const
deleteUser
=
(
socketID
,
roomID
)
=>
{
let
roomUsers
=
users
[
roomID
];
if
(
!
roomUsers
)
return
;
roomUsers
=
roomUsers
.
filter
((
user
)
=>
user
.
id
!==
socketID
);
users
[
roomID
]
=
roomUsers
;
if
(
roomUsers
.
length
===
0
)
{
delete
users
[
roomID
];
}
delete
socketToRoom
[
socketID
];
};
const
closeRecevierPC
=
(
socketID
)
=>
{
if
(
!
receiverPCs
[
socketID
])
return
;
receiverPCs
[
socketID
].
close
();
delete
receiverPCs
[
socketID
];
};
const
closeSenderPCs
=
(
socketID
)
=>
{
if
(
!
senderPCs
[
socketID
])
return
;
let
len
=
senderPCs
[
socketID
].
length
;
for
(
let
i
=
0
;
i
<
len
;
i
++
)
{
senderPCs
[
socketID
][
i
].
pc
.
close
();
let
_senderPCs
=
senderPCs
[
senderPCs
[
socketID
][
i
].
id
];
let
senderPC
=
_senderPCs
.
filter
((
sPC
)
=>
sPC
.
id
===
socketID
);
if
(
senderPC
[
0
])
{
senderPC
[
0
].
pc
.
close
();
senderPCs
[
senderPCs
[
socketID
][
i
].
id
]
=
_senderPCs
.
filter
(
(
sPC
)
=>
sPC
.
id
!==
socketID
);
}
}
delete
senderPCs
[
socketID
];
};
io
.
on
(
"
connection
"
,
(
socket
)
=>
{
console
.
log
(
"
a user connected
"
);
console
.
log
(
"
socket connection complete
"
);
socket
.
on
(
"
joinRoom
"
,
(
data
)
=>
{
try
{
let
allUsers
=
getOtherUsersInRoom
(
data
.
id
,
data
.
roomID
);
io
.
to
(
data
.
id
).
emit
(
"
allUsers
"
,
{
users
:
allUsers
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
});
socket
.
on
(
"
senderOffer
"
,
async
(
data
)
=>
{
try
{
socketToRoom
[
data
.
senderSocketID
]
=
data
.
roomID
;
let
pc
=
createReceiverPeerConnection
(
data
.
senderSocketID
,
socket
,
data
.
roomID
);
await
pc
.
setRemoteDescription
(
data
.
sdp
);
let
sdp
=
await
pc
.
createAnswer
({
offerToReceiveAudio
:
true
,
offerToReceiveVideo
:
true
,
});
await
pc
.
setLocalDescription
(
sdp
);
socket
.
join
(
data
.
roomID
);
io
.
to
(
data
.
senderSocketID
).
emit
(
"
getSenderAnswer
"
,
{
sdp
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
});
socket
.
on
(
"
senderCandidate
"
,
async
(
data
)
=>
{
try
{
let
pc
=
receiverPCs
[
data
.
senderSocketID
];
await
pc
.
addIceCandidate
(
new
wrtc
.
RTCIceCandidate
(
data
.
candidate
));
}
catch
(
error
)
{
console
.
log
(
error
);
}
});
socket
.
on
(
"
receiverOffer
"
,
async
(
data
)
=>
{
try
{
let
pc
=
createSenderPeerConnection
(
data
.
receiverSocketID
,
data
.
senderSocketID
,
socket
,
data
.
roomID
);
await
pc
.
setRemoteDescription
(
data
.
sdp
);
let
sdp
=
await
pc
.
createAnswer
({
offerToReceiveAudio
:
false
,
offerToReceiveVideo
:
false
,
});
await
pc
.
setLocalDescription
(
sdp
);
io
.
to
(
data
.
receiverSocketID
).
emit
(
"
getReceiverAnswer
"
,
{
id
:
data
.
senderSocketID
,
sdp
,
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
});
socket
.
on
(
"
receiverCandidate
"
,
async
(
data
)
=>
{
try
{
const
senderPC
=
senderPCs
[
data
.
senderSocketID
].
filter
(
(
sPC
)
=>
sPC
.
id
===
data
.
receiverSocketID
);
await
senderPC
[
0
].
pc
.
addIceCandidate
(
new
wrtc
.
RTCIceCandidate
(
data
.
candidate
)
);
}
catch
(
error
)
{
console
.
log
(
error
);
}
});
socket
.
on
(
"
disconnect
"
,
()
=>
{
try
{
let
roomID
=
socketToRoom
[
socket
.
id
];
deleteUser
(
socket
.
id
,
roomID
);
closeRecevierPC
(
socket
.
id
);
closeSenderPCs
(
socket
.
id
);
socket
.
on
(
"
connected
"
,
(
data
)
=>
{
console
.
log
(
data
);
socket
.
broadcast
.
to
(
roomID
).
emit
(
"
userExit
"
,
{
id
:
socket
.
id
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
});
socket
.
emit
(
"
toclient
"
,
{
msg
:
"
안녕하세요
"
});
});
export
default
server
;
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment