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
messenger
Commits
7b2efa8f
Commit
7b2efa8f
authored
Jan 26, 2021
by
Soo Hyun Kim
Browse files
0126머지후
parents
650999ad
108b1b94
Changes
23
Show whitespace changes
Inline
Side-by-side
client/src/Components/Chat.js
View file @
7b2efa8f
...
...
@@ -4,15 +4,23 @@ import { Form, Button, Row, Image, Col, Container } from 'react-bootstrap';
import
{
isAuthenticated
}
from
'
../utils/auth
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
function
Chat
(
props
)
{
// let defaultname = sessionStorage.getItem('name');
const
[
sender
,
setSender
]
=
useState
([])
const
INIT_CHAT
=
{
msg
:
''
,
sender
:
''
,
img
:
''
,
time
:
''
}
function
Chat
(
props
)
{
//const [sender, setSender] = useState([])
//const [roomName, setRoomName] = useState('')
const
[
inner
,
setInner
]
=
useState
([
''
])
const
[
chat
,
setChat
]
=
useState
([])
//object로 key는 보낸사람 value는 메세지
const
[
chat
,
setChat
]
=
useState
([
INIT_CHAT
])
//object로 key는 보낸사람 value는 메세지
const
[
img
,
setImg
]
=
useState
([])
const
simpleTime
=
new
Date
().
toLocaleTimeString
()
const
usualTime
=
simpleTime
.
substring
(
0
,
simpleTime
.
length
-
3
)
const
realTime
=
new
Date
().
toISOString
()
const
[
disabled
,
setDisabled
]
=
useState
(
true
)
const
[
user
,
setUser
]
=
useState
(
''
)
...
...
@@ -35,15 +43,16 @@ function Chat(props) {
e
.
preventDefault
()
setInner
(
e
.
target
.
value
)
setDisabled
(
false
)
//console.log(chat)
}
function
sendMsgCH
(
e
)
{
e
.
preventDefault
()
props
.
setSingleTime
(
usualTime
)
props
.
setSingleImg
(
user
.
profileimg
)
props
.
setSingleUser
(
user
.
nickname
)
props
.
setSingleChat
(
inner
)
props
.
sendMsg
(
e
)
setInner
(
''
)
setDisabled
(
true
)
...
...
@@ -52,40 +61,73 @@ function Chat(props) {
function
handleClick
()
{
props
.
closeChatRoom
(
props
.
roomCode
)
props
.
setRecievedMsg
(
''
)
console
.
log
(
chat
)
props
.
handleChatc
()
props
.
setLeaveInfo
([...
props
.
leaveInfo
,
{
roomName
:
props
.
roomCode
,
leaveTime
:
realTime
}])
console
.
log
(
'
나간시간
'
,
realTime
,
usualTime
)
setChat
([
''
])
props
.
handleChatc
()
props
.
setLeaveInfo
([...
props
.
leaveInfo
,
{
roomName
:
props
.
roomCode
,
leaveTime
:
realTime
}])
}
function
settingtime
(
hour
)
{
let
newhour
=
parseInt
(
hour
)
+
9
if
(
newhour
>=
24
)
{
newhour
-=
24
}
if
(
newhour
>=
13
)
{
newhour
-=
12
newhour
=
'
오후
'
+
newhour
}
else
{
newhour
=
'
오전
'
+
newhour
}
return
newhour
}
async
function
exitAndCloseRoom
(){
//이전 채팅 내용에 대한 것 불러오기
//프사 닉네임 메세지가 각각의 배열로 들어가서 띄워지는 방식
async
function
getPreviousChat
()
{
const
respond
=
await
axios
.
get
(
'
/room/getChatInfo
'
,
{
params
:
{
'
roomCode
'
:
props
.
roomCode
}
})
console
.
log
(
respond
)
const
info
=
respond
.
data
let
intochat
=
[]
for
(
let
prop
in
info
)
{
let
hour
=
info
[
prop
].
createdAt
.
split
(
'
T
'
)[
1
].
split
(
'
:
'
)
hour
=
settingtime
(
hour
[
0
])
+
'
:
'
+
hour
[
1
]
intochat
.
push
({
msg
:
info
[
prop
].
message
,
sender
:
info
[
prop
].
username
,
img
:
info
[
prop
].
profileimg
,
time
:
hour
})
}
setChat
(
intochat
)
}
async
function
exitAndCloseRoom
()
{
props
.
exitRoom
(
props
.
roomCode
)
setExit
(
false
)
props
.
handleChatc
()
}
useEffect
(()
=>
{
getProfile
(
userId
)
},
[
userId
])
useEffect
(()
=>
{
setImg
([...
img
,
props
.
singleImg
])
setSender
([...
sender
,
props
.
singleUser
])
setChat
([...
chat
,
props
.
singleChat
])
console
.
log
(
'
chat
'
,
chat
)
console
.
log
(
'
sender
'
,
sender
)
setChat
([...
chat
,
{
msg
:
props
.
singleChat
,
sender
:
props
.
singleUser
,
img
:
props
.
singleImg
,
time
:
props
.
singleTime
}])
},
[
props
.
singleChat
])
useEffect
(()
=>
{
setImg
([...
img
,
props
.
recievedImg
])
setSender
([...
sender
,
props
.
recievedUser
])
setChat
([...
chat
,
props
.
recievedMsg
])
setChat
([...
chat
,
{
msg
:
props
.
recievedMsg
,
sender
:
props
.
recievedUser
,
img
:
props
.
recievedImg
,
time
:
props
.
recievedTime
}])
},
[
props
.
recievedMsg
])
const
time
=
new
Date
().
toLocaleTimeString
()
useEffect
(()
=>
{
getPreviousChat
()
// console.log('겟 룸네임', chat)
},
[
props
.
roomCode
])
return
(
<>
<
Container
id
=
"
chat
"
style
=
{{
overflow
:
'
auto
'
,
padding
:
'
20px
'
,
border
:
"
2px solid
"
,
height
:
"
500px
"
,
margin
:
"
1%
"
,
borderColor
:
"
#BDBDBD
"
,
background
:
''
}}
>
<
Row
className
=
"
justify-content-center
"
style
=
{{
border
:
"
2px solid
"
,
borderWidth
:
"
medium
"
,
borderColor
:
"
#FFD75F
"
,
height
:
"
80px
"
}}
>
<
Container
id
=
"
chat
"
style
=
{{
overflow
:
'
auto
'
,
padding
:
'
20px
'
,
border
:
"
2px solid
"
,
height
:
"
500px
"
,
margin
:
"
1%
"
,
borderColor
:
"
9174ad
"
,
background
:
''
}}
>
<
Row
className
=
"
d-flex
justify-content-center
"
style
=
{{
border
:
"
2px solid
"
,
borderWidth
:
"
medium
"
,
borderColor
:
"
9174ad
"
,
height
:
"
80px
"
,
margin
:
"
1%
"
}}
>
<
Col
md
=
"
auto
"
>
<
Button
variant
=
"
light
"
onClick
=
{
handleClick
}
>
{
`<`
}
<
/Button
>
<
/Col
>
...
...
@@ -103,30 +145,35 @@ function Chat(props) {
<
Col
md
=
"
auto
"
><
Button
variant
=
"
light
"
onClick
=
{
exitAndCloseRoom
}
style
=
{{
fontWeight
:
"
bold
"
}}
>
{
"
나가기
"
}
<
/Button></
Col
>
<
/Row
>
:
null
}
<
p
>
{
props
.
newUser
}
님이
입장하셨습니다
.
<
/p
>
{
chat
.
map
((
value
,
index
)
=>
{
if
(
!
(
value
==
''
))
{
if
(
!
(
sender
[
index
]
===
user
.
nickname
))
{
if
(
!
(
value
.
msg
===
''
))
{
if
(
value
.
sender
===
"
system
"
)
{
return
(
<
Row
className
=
'
border
'
style
=
{{
background
:
"
#FFFAFA
"
}}
>
{
value
.
msg
}
<
/Row
>
)
}
else
if
(
!
(
value
.
sender
===
user
.
nickname
))
{
return
(
<
Row
key
=
{
index
}
className
=
'
m-1
'
>
<
Col
xs
=
{
2
}
>
<
Image
src
=
{
img
&&
`/images/
${
img
[
index
]
}
`
}
style
=
{{
width
:
"
50px
"
,
height
:
"
50px
"
}}
roundedCircle
/>
<
Image
src
=
{
value
.
img
&&
`/images/
${
value
.
img
}
`
}
style
=
{{
width
:
"
50px
"
,
height
:
"
50px
"
}}
roundedCircle
/>
<
/Col
>
<
Col
xs
=
{
8
}
>
<
Row
><
strong
>
{
sender
[
index
]
}
<
/strong></
Row
>
<
Row
><
strong
>
{
value
.
sender
}
<
/strong></
Row
>
<
Row
className
=
'
d-flex flex-wrap-nowrap
'
>
<
Row
className
=
'
border
border-dark
'
style
=
{{
width
:
'
max-content
'
,
maxWidth
:
'
300px
'
,
height
:
'
auto
'
,
paddingLeft
:
'
15px
'
,
paddingRight
:
'
15px
'
,
background
:
'
white
'
,
borderRadius
:
'
5px
'
,
fontSize
:
'
x-large
'
}}
>
{
value
}
<
/Row
>
<
Col
className
=
'
ml-1
'
>
{
time
}
<
/Col
>
<
Row
className
=
'
border
'
style
=
{{
width
:
'
max-content
'
,
maxWidth
:
'
300px
'
,
height
:
'
auto
'
,
paddingLeft
:
'
15px
'
,
paddingRight
:
'
15px
'
,
background
:
'
#f1ebf7
'
,
borderRadius
:
'
5px
'
,
fontSize
:
'
x-large
'
}}
>
{
value
.
msg
}
<
/Row
>
<
Col
className
=
'
ml-1
'
>
{
value
.
time
}
<
/Col
>
<
/Row
>
<
/Col
>
<
/Row
>
)
}
else
{
return
(
return
(
//내가 보낸 메시지
<
Row
key
=
{
index
}
className
=
'
m-1 justify-content-end
'
>
<
Row
className
=
'
d-flex flex-wrap-nowrap
'
>
<
Col
className
=
'
mr-1
'
>
{
time
}
<
/Col
>
<
Row
className
=
'
mr-2
'
style
=
{{
width
:
'
max-content
'
,
maxWidth
:
'
300px
'
,
height
:
'
auto
'
,
paddingLeft
:
'
15px
'
,
paddingRight
:
'
15px
'
,
background
:
'
yellow
'
,
borderRadius
:
'
3px
'
,
fontSize
:
'
x-large
'
}}
>
{
value
}
<
/Row
>
<
Col
className
=
'
mr-1
'
>
{
value
.
time
}
<
/Col
>
<
Row
className
=
'
mr-2
'
name
=
'
msg
'
style
=
{{
width
:
'
max-content
'
,
maxWidth
:
'
300px
'
,
height
:
'
auto
'
,
paddingLeft
:
'
15px
'
,
paddingRight
:
'
15px
'
,
background
:
"
#d6c8e3
"
,
borderRadius
:
'
3px
'
,
fontSize
:
'
x-large
'
}}
>
{
value
.
msg
}
<
/Row
>
<
/Row
>
<
/Row
>
)
...
...
@@ -140,9 +187,8 @@ function Chat(props) {
<
/Container
>
<
Form
onSubmit
=
{
sendMsgCH
}
fluid
>
<
Form
.
Group
className
=
'
d-flex flex-wrap-nowrap justify-content-center m-3
'
>
<
Form
.
Control
className
=
'
border border-warning
'
name
=
'
chat
'
type
=
"
text
"
value
=
{
inner
}
onChange
=
{
handleChange
}
style
=
{{
width
:
'
85%
'
}}
/
>
<
Button
variant
=
"
warning
"
type
=
"
submit
"
disabled
=
{
disabled
}
style
=
{{
width
:
'
10%
'
}}
>
전송
<
Form
.
Control
name
=
'
chat
'
type
=
"
text
"
value
=
{
inner
}
onChange
=
{
handleChange
}
style
=
{{
borderColor
:
"
#9174ad
"
}}
/
>
<
Button
className
=
"
ml-1
"
type
=
"
submit
"
disabled
=
{
disabled
}
style
=
{{
width
:
'
25%
'
,
backgroundColor
:
"
#9174ad
"
,
borderColor
:
"
#9174ad
"
}}
>
전송
<
/Button
>
<
/Form.Group
>
<
/Form
>
...
...
client/src/Components/ClosedList.js
View file @
7b2efa8f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
import
{
ListGroup
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
import
React
from
'
react
'
import
{
Badge
,
ListGroup
}
from
'
react-bootstrap
'
;
const
INIT_LIST
=
[{
interest
:
''
,
isOpen
:
''
,
memeber
:
[],
roomId
:
''
,
roomName
:
''
,
}]
function
ClosedList
(
props
)
{
const
[
list
,
setList
]
=
useState
([]);
useEffect
(()
=>
{
getClosedList
();
},
[
props
.
roomCode
]);
async
function
getClosedList
()
{
const
userid
=
sessionStorage
.
getItem
(
'
userId
'
)
let
res
=
await
axios
.
get
(
'
/room/closedlist
'
,
{
params
:
{
'
_id
'
:
userid
}
})
setList
(
res
.
data
)
}
function
enterChatRoomCH
(
e
)
{
if
(
props
.
roomCode
){
if
(
props
.
roomCode
)
{
props
.
closeChatRoom
(
props
.
roomCode
)
}
const
roomCode
=
e
.
target
.
name
...
...
@@ -25,18 +19,57 @@ function ClosedList(props) {
props
.
enterChatRoom
(
roomCode
)
props
.
setRoomCode
(
roomCode
)
props
.
setRoomName
(
roomName
)
// console.log('rrrrrrrrrrrrrrr', props.closedlist)
// console.log('1111111111111111111', props.leaveInfo, typeof (props.leaveInfo))
}
// const [checknew, setChecknew] = useState([])
// const [unreadnumber, setUnreadnumber] = useState([''])
// async function dbChat() {
// for (let i = 0; i <= props.closedlist.length - 1; i++) {
// const respond = await axios.get('/room/dbChat', { params: { 'roomId': props.closedlist[i].roomId } })
// setChecknew(respond.data)
// }
// }
// useEffect(() => {
// dbChat()
// }, [props.singleChat, props.recievedMsg])
// useEffect(() => {
// // console.log('chat 클라이언트 변경!')
// unreadMessage()
// }, [checknew])
// async function unreadMessage() {
// //여기서 나간시간과 db의 메세지와 시간비교해서 개수를 count해주면 됨
// //물론 그 방 별로 찾아서 list를 맵써서 하던?
// // console.log('ddddddddd', list[0].roomId)
// setUnreadnumber([''])
// let arr = []
// for (let i = 0; i <= props.closedlist.length - 1; i++) {
// const respond = await axios.get('/room/unreadMessage', { params: { 'leaveInfo': props.leaveInfo, 'roomId': props.closedlist[i].roomId } })
// // setUnreadnumber([...unreadnumber, respond.data])
// arr = [...arr, respond.data]
// }
// setUnreadnumber(arr)
// // console.log('클라이언트 클로즈드 카운드', unreadnumber, list.length)
// }
return
(
<
div
>
{
list
.
map
((
item
,
index
)
=>
<
ListGroup
key
=
{
index
}
>
{
props
.
closed
list
.
map
((
item
,
index
)
=>
<
ListGroup
key
=
{
index
}
>
<
ListGroup
.
Item
action
onClick
=
{
enterChatRoomCH
}
name
=
{
item
.
roomId
}
value
=
{
item
.
roomName
}
>
{
item
.
roomName
}
{
/* {[index] ? <Badge className='ml-2' pill variant='danger'>{unreadnumber[index]}</Badge> : ''} */
}
<
/ListGroup.Item
>
<
/ListGroup
>
)}
<
/div
>
)
}
<
/div
>
)
}
...
...
client/src/Components/EnterRoom.js
View file @
7b2efa8f
...
...
@@ -8,8 +8,7 @@ function EnterRoom(props) {
const
[
enterCode
,
setEnterCode
]
=
useState
(
''
);
const
[
error
,
setError
]
=
useState
(
''
);
const
userId
=
sessionStorage
.
getItem
(
'
userId
'
);
//sessionStorage에 저장된 userId가져옴
const
userId
=
sessionStorage
.
getItem
(
'
userId
'
);
function
handleChange
(
event
)
{
const
{
name
,
value
}
=
event
.
target
...
...
@@ -23,13 +22,16 @@ function EnterRoom(props) {
setError
(
''
)
let
res
=
await
axios
.
post
(
'
/room/enterRoom
'
,
{
enterCode
})
await
axios
.
put
(
'
/room/member
'
,
{
userId
:
userId
,
roomId
:
enterCode
})
const
response
=
await
axios
.
get
(
'
/users/check
'
,
{
params
:
{
'
_id
'
:
userId
}
})
const
userNick
=
response
.
data
.
nickname
;
props
.
setRoomName
(
res
.
data
)
props
.
setRoomCode
(
enterCode
)
props
.
setSysmsg
(
`
${
userNick
}
님이 들어왔습니다.`
)
props
.
enterChatRoom
(
enterCode
)
props
.
handleCloseEnter
()
props
.
handleChato
()
setEnterCode
(
''
)
}
catch
(
error
){
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
...
...
client/src/Components/Menu.js
View file @
7b2efa8f
import
React
from
'
react
'
import
{
Navbar
,
Nav
,
Button
}
from
'
react-bootstrap
'
;
import
{
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
{
handleLogout
}
from
'
../utils/auth
'
;
...
...
@@ -8,22 +8,27 @@ function Menu() {
const
name
=
sessionStorage
.
getItem
(
'
name
'
);
return
(
<
Navbar
bg
=
"
dark
"
variant
=
"
dark
"
>
<
Navbar
.
Brand
href
=
"
/home
"
>
YDK
Messenger
<
/Navbar.Brand
>
<
Navbar
style
=
{{
backgroundColor
:
"
#61477a
"
}}
variant
=
"
dark
"
>
<
div
className
=
"
container-fluid
"
>
<
Navbar
.
Brand
className
=
"
navbar-brand
"
href
=
"
/home
"
>
YDK
Messenger
<
/Navbar.Brand
>
{
name
?
<>
<
di
v
className
=
'
ml-1 mr-2
'
style
=
{{
color
:
'
white
'
}}
>
{
name
}
님
환영합니다
<
/div
>
<
Nav
className
=
"
mr-auto
"
>
<
Na
v
className
=
"
nav navbar-nav mr-auto
"
style
=
{{
color
:
'
white
'
}}
>
<
Nav
.
Item
className
=
"
mt-2 mr-4
"
>
{
name
}
님
환영합니다
<
/Nav.Item
>
<
Nav
.
Link
href
=
"
/profile
"
>
Profile
<
/Nav.Link
>
<
Nav
.
Link
onClick
=
{()
=>
handleLogout
()}
href
=
"
/login
"
>
logout
<
/Nav.Link
>
<
/Nav
>
<
Button
className
=
"
ml-auto
"
onClick
=
{()
=>
handleLogout
()}
variant
=
"
light
"
>
Logout
<
/Button
>
<
/
>
:
<
Nav
className
=
"
ml-auto
"
>
<
Nav
.
Link
href
=
'
/login
'
>
로그인
<
/Nav.Link
>
<
Nav
.
Link
href
=
'
/signup
'
>
회원가입
<
/Nav.Link
>
<
/Nav>
}
:
<>
<
Nav
className
=
"
nav navbar-nav
"
>
<
Nav
.
Link
href
=
"
/login
"
>
Login
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/signup
"
>
Signup
<
/Nav.Link
>
<
/Nav
>
<
/>
}
<
/div
>
<
/Navbar
>
)
}
export
default
Menu
client/src/Components/OpenList.js
View file @
7b2efa8f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
import
React
from
'
react
'
import
{
ListGroup
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
function
OpenList
(
props
)
{
const
[
openlist
,
setOpenlist
]
=
useState
([])
useEffect
(()
=>
{
getOpenList
();
},
[
props
.
roomCode
]);
async
function
getOpenList
()
{
let
res
=
await
axios
.
get
(
'
/room/openlist
'
)
setOpenlist
(
res
.
data
)
}
function
enterChatRoomCH
(
e
)
{
if
(
props
.
roomCode
){
...
...
@@ -30,7 +18,7 @@ function OpenList(props) {
return
(
<
div
>
{
openlist
.
map
((
item
,
index
)
=>
{
props
.
openlist
.
map
((
item
,
index
)
=>
<
ListGroup
key
=
{
index
}
>
<
ListGroup
.
Item
action
onClick
=
{
enterChatRoomCH
}
name
=
{
item
.
roomId
}
>
{
item
.
roomName
}
...
...
client/src/Components/RoomMake.js
View file @
7b2efa8f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
import
React
,
{
useState
}
from
'
react
'
import
axios
from
'
axios
'
;
import
{
Row
,
Col
,
Modal
,
Button
,
Form
,
Alert
}
from
'
react-bootstrap
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
...
...
@@ -11,19 +11,13 @@ const INIT_ROOM = {
function
RoomMake
(
props
)
{
const
[
room
,
setRoom
]
=
useState
(
INIT_ROOM
);
const
[
disabled
,
setDisabled
]
=
useState
(
true
);
const
[
error
,
setError
]
=
useState
(
''
);
useEffect
(()
=>
{
const
isRoom
=
Object
.
values
(
room
).
every
(
el
=>
Boolean
(
el
))
isRoom
?
setDisabled
(
false
)
:
setDisabled
(
true
)
},
[
room
])
const
member
=
sessionStorage
.
getItem
(
'
userId
'
);
function
handleChange
(
event
)
{
const
{
name
,
value
}
=
event
.
target
setRoom
({
...
room
,
[
name
]:
value
,
member
})
console
.
log
(
room
)
setRoom
({
...
room
,
[
name
]:
value
,
member
})
//
console.log(room)
}
async
function
handleSubmit
(
event
)
{
...
...
@@ -36,7 +30,7 @@ function RoomMake(props) {
props
.
handleCloseModal
()
props
.
handleChato
()
setRoom
(
INIT_ROOM
)
}
catch
(
error
)
{
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
...
...
client/src/Pages/HomePage.js
View file @
7b2efa8f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
import
{
Row
,
Col
,
Button
,
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
Tabs
from
'
react-bootstrap/Tabs
'
;
import
Tab
from
'
react-bootstrap/Tab
'
;
import
{
Row
,
Col
,
Button
,
Tabs
,
Tab
}
from
'
react-bootstrap
'
;
import
ClosedList
from
'
../Components/ClosedList
'
;
import
OpenList
from
'
../Components/OpenList
'
;
import
Menu
from
'
../Components/Menu
'
;
...
...
@@ -19,10 +17,17 @@ const INIT_ROOM = {
roomId
:
''
,
member
:
''
,
}
const
INIT_LIST
=
[{
interest
:
''
,
isOpen
:
''
,
memeber
:
[],
roomId
:
''
,
roomName
:
''
,
}]
function
Home
()
{
const
userName
=
sessionStorage
.
getItem
(
'
name
'
)
const
userId
=
sessionStorage
.
getItem
(
'
userId
'
)
;
const
userId
=
sessionStorage
.
getItem
(
'
userId
'
)
const
[
showModal
,
setShowModal
]
=
useState
(
false
);
const
[
showEnter
,
setShowEnter
]
=
useState
(
false
);
...
...
@@ -35,7 +40,7 @@ function Home() {
const
[
singleChat
,
setSingleChat
]
=
useState
(
''
)
const
[
recievedMsg
,
setRecievedMsg
]
=
useState
(
''
)
const
[
roomCode
,
setRoomCode
]
=
useState
(
''
)
const
[
newUser
,
setNewUser
]
=
useState
(
''
)
const
[
sysmsg
,
setSysmsg
]
=
useState
(
''
)
const
[
roomName
,
setRoomName
]
=
useState
(
''
)
const
[
singleUser
,
setSingleUser
]
=
useState
(
''
)
...
...
@@ -44,25 +49,27 @@ function Home() {
const
[
singleImg
,
setSingleImg
]
=
useState
(
''
)
const
[
recievedImg
,
setRecievedImg
]
=
useState
(
''
)
const
[
singleTime
,
setSingleTime
]
=
useState
(
''
)
const
[
recievedTime
,
setRecievedTime
]
=
useState
(
''
)
const
[
leaveInfo
,
setLeaveInfo
]
=
useState
([{
roomName
:
""
,
leaveTime
:
""
}])
const
handleCloseModal
=
()
=>
setShowModal
(
false
);
const
handleShowModal
=
()
=>
setShowModal
(
true
);
const
handleCloseEnter
=
()
=>
setShowEnter
(
false
);
const
handleShowEnter
=
()
=>
setShowEnter
(
true
);
const
handleChato
=
()
=>
setChat
(
true
);
const
handleChatc
=
()
=>
setChat
(
false
);
const
[
closedlist
,
setClosedList
]
=
useState
(
INIT_LIST
);
const
[
openlist
,
setOpenlist
]
=
useState
([])
//SOCKET 방 enter, close, exit event
function
enterChatRoom
(
rCode
)
{
//방 입장하기
//SOCKET 관련 시작
async
function
enterChatRoom
(
rCode
)
{
//방 입장하기
socket
.
emit
(
'
joinRoom
'
,
rCode
)
socket
.
emit
(
'
newUser
'
,
{
rmIf
:
rCode
,
userInfo
:
userName
})
console
.
log
(
`joinRoom :
${
rCode
}
입장`
)
//여기서 채팅 불러와서 넘겨주던가 해야할거 같은데
}
socket
.
on
(
"
sendUser
"
,
(
data
)
=>
{
setNewUser
(
data
)
})
function
closeChatRoom
(
rCode
)
{
socket
.
emit
(
'
closeRoom
'
,
rCode
)
console
.
log
(
`
${
rCode
}
방 보기 중단`
)
...
...
@@ -74,13 +81,22 @@ function Home() {
setRoomCode
(
""
)
}
async
function
getClosedList
()
{
const
userid
=
sessionStorage
.
getItem
(
'
userId
'
)
let
res
=
await
axios
.
get
(
'
/room/closedlist
'
,
{
params
:
{
'
_id
'
:
userid
}
})
setClosedList
(
res
.
data
)
}
async
function
getOpenList
()
{
let
res
=
await
axios
.
get
(
'
/room/openlist
'
)
console
.
log
(
'
getOpenlist
'
,
res
.
data
)
setOpenlist
(
res
.
data
)
}
//오픈채팅방에서 참가하기
async
function
openListroom
(
roomId
)
{
console
.
log
(
roomId
)
const
roomInf
=
await
axios
.
get
(
'
/room/changeMem
'
,
{
params
:
{
'
roomId
'
:
roomId
}
})
console
.
log
(
roomInf
)
console
.
log
(
roomInf
.
data
)
console
.
log
(
roomInf
.
data
[
0
])
setRoom
(
roomInf
.
data
[
0
])
setOpen
(
true
)
setShow
(
false
)
...
...
@@ -89,8 +105,11 @@ function Home() {
async
function
attendListRoom
()
{
const
roomId
=
room
.
roomId
const
tf
=
await
axios
.
put
(
'
/room/changeMem
'
,
{
userId
:
userId
,
roomId
:
roomId
})
const
response
=
await
axios
.
get
(
'
/users/check
'
,
{
params
:
{
'
_id
'
:
userId
}
})
const
userNick
=
response
.
data
.
nickname
;
if
(
tf
.
data
)
{
alert
(
'
참가되었습니다.
'
)
setSysmsg
(
`
${
userNick
}
님이 들어왔습니다.`
)
}
else
{
alert
(
'
이미 참가된 방입니다.
'
)
}
...
...
@@ -103,24 +122,42 @@ function Home() {
e
.
preventDefault
()
}
useEffect
(()
=>
{
getClosedList
();
getOpenList
();
},
[
roomCode
]);
useEffect
(()
=>
{
if
(
!
(
singleChat
==
""
))
{
if
(
!
(
singleChat
==
=
""
))
{
socket
.
emit
(
"
chat
"
,
{
roomInfo
:
roomCode
,
sendInfo
:
{
msg
:
singleChat
,
sender
:
singleUser
,
img
:
singleImg
img
:
singleImg
,
time
:
singleTime
}
})
setSingleChat
(
""
)
}
},
[
singleChat
])
useEffect
(()
=>
{
if
(
!
(
sysmsg
===
''
))
{
socket
.
emit
(
"
chat
"
,
{
roomInfo
:
roomCode
,
sendInfo
:
{
msg
:
sysmsg
,
sender
:
"
system
"
,
}
})
setSysmsg
(
''
)
}
},
[
sysmsg
])
useEffect
(()
=>
{
socket
.
on
(
"
sendedMSG
"
,
(
sendInfo
)
=>
{
setRecievedTime
(
sendInfo
.
time
)
setRecievedImg
(
sendInfo
.
img
)
setRecievedUser
(
sendInfo
.
sender
)
setRecievedMsg
(
sendInfo
.
msg
)
...
...
@@ -139,10 +176,10 @@ function Home() {
<Nav> */
}
<
Tabs
defaultActiveKey
=
"
closed
"
id
=
"
uncontrolled-tab-example
"
>
<
Tab
eventKey
=
"
closed
"
title
=
"
내 채팅
"
onClick
=
{
handleChato
}
>
<
ClosedList
enterChatRoom
=
{
enterChatRoom
}
setRoomCode
=
{
setRoomCode
}
setRoomName
=
{
setRoomName
}
roomCode
=
{
roomCode
}
closeChatRoom
=
{
closeChatRoom
}
/
>
<
ClosedList
closedlist
=
{
closedlist
}
singleChat
=
{
singleChat
}
recievedMsg
=
{
recievedMsg
}
leaveInfo
=
{
leaveInfo
}
setLeaveInfo
=
{
setLeaveInfo
}
enterChatRoom
=
{
enterChatRoom
}
setRoomCode
=
{
setRoomCode
}
setRoomName
=
{
setRoomName
}
roomCode
=
{
roomCode
}
closeChatRoom
=
{
closeChatRoom
}
/
>
<
/Tab
>
<
Tab
eventKey
=
"
open
"
title
=
"
공개방
"
onClick
=
{
handleChatc
}
>
<
OpenList
enterChatRoom
=
{
enterChatRoom
}
openListroom
=
{
openListroom
}
setRoomCode
=
{
setRoomCode
}
setRoomName
=
{
setRoomName
}
roomCode
=
{
roomCode
}
closeChatRoom
=
{
closeChatRoom
}
/
>
<
OpenList
openlist
=
{
openlist
}
enterChatRoom
=
{
enterChatRoom
}
openListroom
=
{
openListroom
}
setRoomCode
=
{
setRoomCode
}
setRoomName
=
{
setRoomName
}
roomCode
=
{
roomCode
}
closeChatRoom
=
{
closeChatRoom
}
/
>
<
/Tab
>
<
/Tabs
>
{
/* </Nav>
...
...
@@ -155,12 +192,12 @@ function Home() {
{(
show
||
chat
)
?
null
:
<
div
style
=
{{
position
:
"
fixed
"
,
bottom
:
"
20px
"
,
right
:
"
30px
"
}}
>
<
Button
variant
=
"
primary
"
onClick
=
{
handleShowModal
}
size
=
"
lg
"
block
>
생성
<
/Button
>
<
Button
variant
=
"
secondary
"
onClick
=
{
handleShowEnter
}
size
=
"
lg
"
block
>
참가
<
/Button
>
<
Button
style
=
{{
borderColor
:
"
#9174ad
"
,
backgroundColor
:
"
#9174ad
"
,
color
:
'
white
'
}}
onClick
=
{
handleShowModal
}
size
=
"
lg
"
block
>
생성
<
/Button
>
<
Button
style
=
{{
borderColor
:
"
#9174ad
"
,
backgroundColor
:
"
#9174ad
"
,
color
:
'
white
'
}}
onClick
=
{
handleShowEnter
}
size
=
"
lg
"
block
>
참가
<
/Button
>
<
/div
>
}
{
chat
?
<
Chat
handleChatc
=
{
handleChatc
}
sendMsg
=
{
sendMsg
}
singleChat
=
{
singleChat
}
singleUser
=
{
singleUser
}
singleImg
=
{
singleImg
}
recievedMsg
=
{
recievedMsg
}
recievedUser
=
{
recievedUser
}
recievedImg
=
{
recievedImg
}
setSingleChat
=
{
setSingleChat
}
set
RecievedMsg
=
{
setRecievedMsg
}
setSingle
User
=
{
setSingle
User
}
setSingle
Img
=
{
setSingle
Im
g
}
roomCode
=
{
roomCode
}
roomName
=
{
roomName
}
closeChatRoom
=
{
closeChatRoom
}
exitRoom
=
{
exitRoom
}
/
>
<
Chat
handleChatc
=
{
handleChatc
}
leaveInfo
=
{
leaveInfo
}
setLeaveInfo
=
{
setLeaveInfo
}
sendMsg
=
{
sendMsg
}
singleChat
=
{
singleChat
}
singleUser
=
{
singleUser
}
singleImg
=
{
singleImg
}
singleTime
=
{
singleTime
}
recievedMsg
=
{
recievedMsg
}
recievedUser
=
{
recievedUser
}
recievedImg
=
{
recievedImg
}
recievedTime
=
{
recievedTime
}
setSingleChat
=
{
setSingleChat
}
set
SingleUser
=
{
setSingleUser
}
setSingle
Img
=
{
setSingle
Img
}
setSingle
Time
=
{
setSingle
Time
}
setRecievedMsg
=
{
setRecievedMs
g
}
roomCode
=
{
roomCode
}
roomName
=
{
roomName
}
closeChatRoom
=
{
closeChatRoom
}
exitRoom
=
{
exitRoom
}
/
>
:
null
}
{
open
?
<
div
className
=
"
vh-90 flex-column align-items-center justify-content-center mt-2
"
variant
=
"
dark
"
>
...
...
@@ -171,8 +208,8 @@ function Home() {
<
h5
>
▷
참여인원
:
{
room
.
member
.
length
}
<
/h5
>
<
h5
className
=
"
mb-3
"
>
▷
방코드
(
방코드를
통해서도
참여할
수
있습니다
.)
:
{
room
.
roomId
}
<
/h5
>
<
Row
className
=
'
justify-content-center
'
>
<
Button
variant
=
"
outline
-warning
"
size
=
"
sm
"
className
=
"
mr-4
"
onClick
=
{
enterButton
}
>
뒤로가기
<
/Button
>
<
Button
variant
=
"
outline
-warning
"
size
=
"
sm
"
className
=
"
ml-4
"
type
=
'
submit
'
onClick
=
{
attendListRoom
}
>
참가
<
/Button
>
<
Button
variant
=
"
outline
"
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#b49dc9
"
}}
size
=
"
sm
"
className
=
"
mr-4
"
onClick
=
{
enterButton
}
>
뒤로가기
<
/Button
>
<
Button
variant
=
"
outline
"
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#b49dc9
"
}}
size
=
"
sm
"
className
=
"
ml-4
"
type
=
'
submit
'
onClick
=
{
attendListRoom
}
>
참가
<
/Button
>
<
/Row
>
<
/div
>
<
/div
>
...
...
@@ -182,10 +219,9 @@ function Home() {
<
/Col
>
<
/Row
>
<
RoomMake
showModal
=
{
showModal
}
handleCloseModal
=
{
handleCloseModal
}
/
>
<
EnterRoom
showEnter
=
{
showEnter
}
enterChatRoom
=
{
enterChatRoom
}
handleCloseEnter
=
{
handleCloseEnter
}
handleChato
=
{
handleChato
}
setRoomCode
=
{
setRoomCode
}
setRoomName
=
{
setRoomName
}
/
>
<
EnterRoom
showEnter
=
{
showEnter
}
enterChatRoom
=
{
enterChatRoom
}
handleCloseEnter
=
{
handleCloseEnter
}
handleChato
=
{
handleChato
}
setRoomCode
=
{
setRoomCode
}
setRoomName
=
{
setRoomName
}
sysmsg
=
{
sysmsg
}
setSysmsg
=
{
setSysmsg
}
/
>
<
/
>
);
}
export
default
Home
;
\ No newline at end of file
client/src/Pages/LogInPage.js
View file @
7b2efa8f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
import
axios
from
'
axios
'
import
{
Button
,
Form
,
Container
,
Navbar
,
Spinner
,
Alert
}
from
'
react-bootstrap
'
;
import
{
Button
,
Form
,
Container
,
Spinner
,
Alert
}
from
'
react-bootstrap
'
;
import
catchErrors
from
'
../utils/catchErrors
'
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
import
{
Redirect
}
from
'
react-router-dom
'
import
{
handleLogin
}
from
'
../utils/auth
'
import
Menu
from
'
../Components/Menu
'
;
...
...
@@ -91,11 +91,12 @@ function LogIn() {
<
Button
disabled
=
{
disabled
||
loading
}
type
=
"
submit
"
variant
=
"
outline
-success
"
variant
=
"
outline
"
size
=
"
lg
"
className
=
"
mr-4
"
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#b49dc9
"
,
background
:
'
white
'
,
font
:
'
dark
'
}}
block
>
{
loading
&&
<
Spinner
as
=
'
span
'
animation
=
'
border
'
size
=
'
sm
'
role
=
'
status
'
aria
-
hidden
=
'
true
'
/>
}
{
'
'
}
로그인
{
loading
&&
<
Spinner
as
=
'
span
'
animation
=
'
border
'
size
=
'
sm
'
role
=
'
status
'
aria
-
hidden
=
'
true
'
style
=
{{
color
:
"
#b49dc9
"
}}
/>} {' '} 로그
인
<
/Button
>
{
error
&&
<
Alert
variant
=
'
danger
'
>
{
error
}
...
...
client/src/Pages/ProfilePage.js
View file @
7b2efa8f
...
...
@@ -113,7 +113,7 @@ function ProfilePage() {
<
/Col
>
<
Col
xs
=
{
3
}
>
<
Form
className
=
"
d-flex
"
onSubmit
=
{
handleSubmitHidVis
}
>
<
Button
className
=
"
ml-3 d-flex justify-content-end
"
variant
=
"
outline
-primary
"
size
=
"
sm
"
type
=
'
submit
'
>
수정
<
/Button
>
<
Button
className
=
"
ml-3 d-flex justify-content-end
"
variant
=
"
outline
"
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#b49dc9
"
,
background
:
'
white
'
}}
size
=
"
sm
"
type
=
'
submit
'
>
수정
<
/Button
>
<
/Form
>
<
/Col
>
<
/Row
>
...
...
@@ -123,9 +123,9 @@ function ProfilePage() {
<
/Row
>
<
Row
className
=
'
m-3 justify-content-center
'
>
<
Form
onSubmit
=
{
handleSubmit
}
>
<
Button
variant
=
"
outline-success
"
size
=
"
sm
"
className
=
"
mr-4
"
type
=
'
submit
'
>
저장
<
/Button
>
<
Button
variant
=
"
outline-success
"
size
=
"
sm
"
className
=
"
mr-4
"
type
=
'
submit
'
variant
=
"
outline
"
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#9174ad
"
,
background
:
'
white
'
}}
>
저장
<
/Button
>
<
Link
to
=
'
/
'
>
<
Button
variant
=
"
outline-success
"
size
=
"
sm
"
className
=
"
ml-4
"
>
홈
화면으로
<
/Button
>
<
Button
variant
=
"
outline-success
"
size
=
"
sm
"
className
=
"
ml-4
"
variant
=
"
outline
"
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#9174ad
"
,
background
:
'
white
'
}}
>
홈
화면으로
<
/Button
>
<
/Link
>
<
/Form
>
<
/Row
>
...
...
client/src/Pages/SignUpPage.js
View file @
7b2efa8f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
import
axios
from
'
axios
'
import
{
Button
,
Form
,
Container
,
Alert
,
Navbar
}
from
'
react-bootstrap
'
;
import
{
Button
,
Form
,
Container
,
Alert
,
Spinner
}
from
'
react-bootstrap
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
Menu
from
'
../Components/Menu
'
;
...
...
@@ -18,6 +18,7 @@ function SingUp() {
const
[
error
,
setError
]
=
useState
(
''
)
const
[
disabled
,
setDisabled
]
=
useState
(
true
)
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
loading
,
setLoading
]
=
useState
(
false
)
useEffect
(()
=>
{
const
isUser
=
Object
.
values
(
user
).
every
(
el
=>
Boolean
(
el
))
...
...
@@ -32,22 +33,15 @@ function SingUp() {
async
function
handleSubmit
(
event
)
{
event
.
preventDefault
();
//빈문자열 입력 시 오류 문자 출력
//const form = event.currentTarget;
//if (form.checkValidity() === false) {
// event.preventDefault();
// event.stopPropagation();
// //event.stopPropagation() : 이벤트 캡쳐링과 버블링에 있어 현재 이벤트 이후의 전파를 막습니다.
//}
//setValidated(true);
// console.log(user)
try
{
setLoading
(
true
)
setError
(
''
)
await
axios
.
post
(
'
/users/signup
'
,
user
)
setSuccess
(
true
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
finally
{
setLoading
(
false
)
}
}
...
...
@@ -57,11 +51,9 @@ function SingUp() {
return
<
Redirect
to
=
'
/login
'
/>
}
return
(
<>
<
Menu
/>
<
Form
onSubmit
=
{
handleSubmit
}
className
=
'
vh-100 flex-column align-items-center justify-content-center mt-2
'
>
<
Container
className
=
"
d-flex justify-content-center
"
>
<
div
className
=
"
mt-5 p-5 shadow w-75
"
>
...
...
@@ -127,10 +119,12 @@ function SingUp() {
<
Button
disabled
=
{
disabled
}
type
=
'
submit
'
variant
=
"
outline
-success
"
variant
=
"
outline
"
size
=
"
lg
"
className
=
"
mr-4
"
block
>
가입
<
/Button
>
style
=
{{
border
:
"
3px solid
"
,
borderColor
:
"
#b49dc9
"
,
background
:
'
white
'
,
font
:
'
dark
'
}}
block
>
{
loading
&&
<
Spinner
as
=
'
span
'
animation
=
'
border
'
size
=
'
sm
'
role
=
'
status
'
aria
-
hidden
=
'
true
'
style
=
{{
color
:
"
#b49dc9
"
}}
/>}가입</
Button
>
{
error
&&
<
Alert
variant
=
'
danger
'
>
{
error
}
<
/Alert>
}
...
...
client/src/utils/auth.js
View file @
7b2efa8f
...
...
@@ -10,7 +10,7 @@ export async function handleLogout() {
sessionStorage
.
clear
();
await
axios
.
get
(
'
/auth/logout
'
)
//login페이지로 이동
window
.
location
.
href
=
'
/login
'
//
window.location.href='/login'
}
export
function
isAuthenticated
()
{
...
...
server/controllers/room.controller.js
View file @
7b2efa8f
import
Room
from
"
../models/Room.js
"
import
{
customAlphabet
}
from
'
nanoid
'
import
isLength
from
'
validator/lib/isLength.js
'
import
Chat
from
"
../models/Chat.js
"
const
nanoid
=
customAlphabet
(
'
1234567890abcdef
'
,
10
)
...
...
@@ -56,7 +57,7 @@ const getOpenList = async (req, res) => {
const
getRoomName
=
async
(
req
,
res
)
=>
{
const
roomId
=
req
.
query
.
roomCode
console
.
log
(
req
.
query
.
roomCode
)
console
.
log
(
'
getRoomName
'
,
req
.
query
.
roomCode
)
try
{
let
roominfo
=
await
Room
.
findOne
({
roomId
:
roomId
}).
select
(
'
roomName
'
)
...
...
@@ -82,7 +83,6 @@ const changemember = async (req, res) => {
else
{
return
res
.
json
(
false
)
}
res
.
end
()
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
멤버 업데이트 실패
'
)
}
...
...
@@ -107,7 +107,6 @@ const deleteUserId = async (req, res) => {
const
roomInf
=
async
(
req
,
res
)
=>
{
try
{
console
.
log
(
req
.
query
.
roomId
)
// let roomInf = await Room.findOne({ member: req.query.roomId }).select('interest roomId member').exec()
let
roomInf
=
await
Room
.
find
({
roomId
:
req
.
query
.
roomId
})
console
.
log
(
'
room_member로 정보 가져오기:
'
,
roomInf
)
return
res
.
json
(
roomInf
)
...
...
@@ -116,4 +115,43 @@ const roomInf = async (req, res) => {
}
}
export
default
{
makeRoom
,
getClosedList
,
getOpenList
,
getRoomName
,
changemember
,
deleteUserId
,
roomInf
}
const
unreadMessage
=
async
(
req
,
res
)
=>
{
let
leaveInfo
=
req
.
query
.
leaveInfo
const
roomId
=
req
.
query
.
roomId
let
leaveTime
=
''
console
.
log
(
'
서버에서 초기 leaveInfo
'
,
leaveInfo
)
for
(
let
i
=
1
;
i
<
leaveInfo
.
length
;
i
++
)
{
//일단 형식좀 맞추고
leaveInfo
[
i
]
=
JSON
.
parse
(
leaveInfo
[
i
])
}
//findOne으로 해보자
for
(
let
i
=
1
;
i
<=
leaveInfo
.
length
-
1
;
i
++
)
{
//그 방의 id와 나간기록의 방과 일치하는지 확인하고
if
(
leaveInfo
[
i
].
roomName
===
roomId
)
{
leaveTime
=
leaveInfo
[
i
].
leaveTime
//그 방에서 나간 시간을 찾아옴
break
;
}
}
const
room_id
=
await
Room
.
find
({
roomId
:
roomId
}).
select
(
'
_id
'
)
//id로 _id를 찾아와서
let
unreadMsg
=
await
Chat
.
find
({
room
:
room_id
}).
select
(
'
createdAt
'
)
//그 방의 메세지와 전송시간을 가져옴
let
count
=
0
//mongoose 시간비교 방법이 있음 (gte...)
for
(
let
i
=
0
;
i
<=
unreadMsg
.
length
-
1
;
i
++
)
{
const
dbtime
=
Date
.
parse
(
unreadMsg
[
i
].
createdAt
)
const
parsedleaveTime
=
Date
.
parse
(
leaveTime
)
if
(
parsedleaveTime
<
dbtime
)
{
//시간 비교를하고 이후에 온 메세지의 개수를 count함
console
.
log
(
'
이번째부터 나중에온 메세지
'
,
i
)
count
+=
1
}
}
res
.
json
(
count
)
}
const
dbChat
=
async
(
req
,
res
)
=>
{
const
roomId
=
req
.
query
.
roomId
const
room_id
=
await
Room
.
find
({
roomId
:
roomId
}).
select
(
'
_id
'
)
let
chatlist
=
await
Chat
.
find
({
room
:
room_id
}).
select
(
'
message
'
)
res
.
json
(
chatlist
)
}
export
default
{
makeRoom
,
getClosedList
,
getOpenList
,
getRoomName
,
changemember
,
roomInf
,
unreadMessage
,
dbChat
,
deleteUserId
}
server/controllers/roomEnter.controller.js
View file @
7b2efa8f
import
Room
from
"
../models/Room.js
"
import
Chat
from
"
../models/Chat.js
"
;
import
User
from
"
../models/User.js
"
;
const
roomEnter
=
async
(
req
,
res
)
=>
{
const
roomId
=
req
.
body
.
enterCode
// console.log(req)
try
{
const
room
=
await
Room
.
findOne
({
roomId
})
if
(
!
room
)
{
return
res
.
status
(
404
).
send
(
`참여코드가 존재하지 않습니다.`
)
}
console
.
log
(
'
roomId존재
'
)
const
name
=
await
Room
.
findOne
({
roomId
:
roomId
}).
select
(
'
roomName
'
)
return
res
.
json
(
name
.
roomName
)
...
...
@@ -22,4 +21,17 @@ const roomEnter = async (req, res) => {
}
}
export
default
{
roomEnter
}
\ No newline at end of file
const
getChatInfo
=
async
(
req
,
res
)
=>
{
const
roomId
=
req
.
query
.
roomCode
try
{
const
room_id
=
await
Room
.
find
({
roomId
:
roomId
}).
select
(
'
_id
'
)
//roomId로 해당 방의 _id를 찾아옴
let
infolist
=
await
Chat
.
find
({
room
:
room_id
}).
select
(
'
message username createdAt profileimg
'
)
res
.
json
(
infolist
)
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
이전 채팅 정보 불러오기를 실패하였습니다!
'
)
}
}
export
default
{
roomEnter
,
getChatInfo
}
\ No newline at end of file
server/controllers/user.controller.js
View file @
7b2efa8f
...
...
@@ -9,7 +9,6 @@ const profileUpload = upload.fields([
{
name
:
'
imageUrl
'
,
maxCount
:
1
},
])
const
signup
=
async
(
req
,
res
)
=>
{
const
{
username
,
nickname
,
email
,
password
}
=
req
.
body
...
...
@@ -84,6 +83,15 @@ const getProfile = (req, res) => {
res
.
json
(
req
.
user
)
}
const
checkUser
=
async
(
req
,
res
)
=>
{
try
{
const
info
=
await
User
.
findOne
({
_id
:
req
.
query
.
_id
})
return
res
.
json
(
info
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
사용자 검색 실패
'
)
}
}
const
loginNavbar
=
async
(
req
,
res
)
=>
{
try
{
...
...
@@ -94,5 +102,5 @@ const loginNavbar = async (req, res) => {
}
}
export
default
{
signup
,
profileUpload
,
update
,
userById
,
getProfile
,
loginNavbar
}
export
default
{
signup
,
profileUpload
,
update
,
userById
,
getProfile
,
loginNavbar
,
checkUser
}
// {} : 객체로 return함
server/models/Chat.js
View file @
7b2efa8f
...
...
@@ -16,6 +16,10 @@ const ChatSchema = new mongoose.Schema({
type
:
String
,
required
:
true
},
profileimg
:{
type
:
String
,
default
:
'
3cd14b9bcb2007f324fcb82e0b566cce
'
}
},
{
timestamps
:
true
})
...
...
server/models/Room.js
View file @
7b2efa8f
...
...
@@ -25,7 +25,7 @@ const RoomSchema = new mongoose.Schema({
member
:
{
type
:
Array
,
required
:
true
,
}
}
,
},
{
timestamps
:
true
})
...
...
server/models/User.js
View file @
7b2efa8f
...
...
@@ -3,6 +3,7 @@
import
mongoose
from
'
mongoose
'
const
{
String
}
=
mongoose
.
Schema
.
Types
const
{
Array
}
=
mongoose
.
Schema
.
Types
//원래 java의 string이 아니라 mongoose의 string을 쓰기 위해 불러옴.
//object의 id를 쓸때에도 추가시켜줘야됨.
...
...
@@ -31,14 +32,16 @@ const UserSchema = new mongoose.Schema({
},
profileimg
:
{
type
:
String
,
default
:
'
3cd14b9bcb2007f324fcb82e0b566cce
'
,
default
:
'
3cd14b9bcb2007f324fcb82e0b566cce
'
,
},
entrylog
:
{
type
:
Array
,
}
},
{
//옵셥을 정의함.
timestamps
:
true
//기본이 false로 되어있음
//user가 추가될때마다 createdAt(만들어진 시간 저장)과 updatedAt(수정될때 시간이 변경되어 저장)가 추가되어 시간을 저장함.
})
export
default
mongoose
.
models
.
User
||
mongoose
.
model
(
'
User
'
,
UserSchema
)
//user라는 이름이 있으면 앞을 return하고 없으면 뒤를 실행함
server/routes/auth.routes.js
View file @
7b2efa8f
...
...
@@ -10,11 +10,6 @@ router.route('/auth/login')
router
.
route
(
'
/auth/logout
'
)
.
get
(
authCtrl
.
logout
)
// /api/users/signup로 들어오는 것을 post (method) 를 통해 useCtrl.signup 이것이 처리함
//browser에서 주소창에 치고 들어가면 get (method) 을 타고 들어간것임
//post를 띄우고 싶으면 앱에서 ARC실행해서 post를 실행하게 만들면됨.
//객체에 접근할때는 .을 찍고 접근함/ ex) .hello
//express middleware : (req, res) => {}
//node(req(client의 정보), res)를 넘겨줌.
export
default
router
\ No newline at end of file
server/routes/room.routers.js
View file @
7b2efa8f
...
...
@@ -22,6 +22,14 @@ router.route('/room/member')
router
.
route
(
'
/room/getRoomName
'
)
.
get
(
roomCtrl
.
getRoomName
)
// router.route('/room/unreadMessage')
// .get(roomCtrl.unreadMessage)
router
.
route
(
'
/room/unreadMessage
'
)
.
get
(
roomCtrl
.
unreadMessage
)
router
.
route
(
'
/room/dbChat
'
)
.
get
(
roomCtrl
.
dbChat
)
router
.
route
(
'
/room/deleteMem
'
)
.
put
(
roomCtrl
.
deleteUserId
)
...
...
server/routes/roomEnter.routers.js
View file @
7b2efa8f
...
...
@@ -5,4 +5,9 @@ const router = express.Router()
router
.
route
(
'
/room/enterRoom
'
)
.
post
(
roomEnterCtrl
.
roomEnter
)
router
.
route
(
'
/room/getChatInfo
'
)
.
get
(
roomEnterCtrl
.
getChatInfo
)
export
default
router
\ No newline at end of file
Prev
1
2
Next
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