chat 디비 저장

client/src/Components/Chat.js

@@ -39,6 +39,12 @@ function Chat(props) {
     setDisabled(true)
     console.log(chat)
   }
+
+  function handleClick(e) {
+    setChat([])
+    props.handleChatc()
+  }
+
   useEffect(() => {
     getProfile(userId)
   }, [userId])
@@ -107,11 +113,7 @@ function Chat(props) {
       })
       }
 
-
-
-
-
-      <Button variant="light" onClick={props.handleChatc} >{`<`}</Button>
+      <Button variant="light" onClick={handleClick} >{`<`}</Button>
       <Form onSubmit={sendMsgCH}>
         <Form.Group className='d-flex flex-wrap-nowrap justify-content-center ml-2 mr-2'>
           <Form.Control className='border border-warning' name='chat' type="text" value={inner} onChange={handleChange} style={{ width: '85%' }} />

client/src/Pages/HomePage.js

@@ -13,6 +13,8 @@ import EnterRoom from "../Components/EnterRoom"
 const socket = io();
 
 function Home() {
+    const userName = sessionStorage.getItem('name')
+
     const [showModal, setShowModal] = useState(false);
     const [showEnter, setEnter] = useState(false);
     const [chat, setChat] = useState(false);
@@ -36,9 +38,9 @@ function Home() {
 
 
     //SOCKET 관련 시작
-    function enterChatRoom(rName) {    //방 입장하기
-        socket.emit('joinRoom', rName)
-        console.log(`joinRoom : ${rName} 입장`)
+    function enterChatRoom(rCode) {    //방 입장하기
+        socket.emit('joinRoom', rCode)
+        console.log(`joinRoom : ${rCode} 입장`)
     }
 
     const sendMsg = (e) => {
@@ -49,7 +51,8 @@ function Home() {
         if (!(singleChat == '')) {
             socket.emit("chat", {
                 roomInfo: roomCode,
-                msg: singleChat
+                username: userName,
+                msg: singleChat,
             })
             setSingleChat([''])
         }
@@ -78,9 +81,8 @@ function Home() {
                     </Tabs>
                 </Col>
                 <Col style={{ padding: "0" }}>
-                    {chat ? <Chat handleChatc={handleChatc} sendMsg={sendMsg} singleChat={singleChat} recievedMsg={recievedMsg} setSingleChat={setSingleChat} roomCode={roomCode} /> : null}
 
-                    <div style={{ position: "fixed", bottom: "20px", right: "30px" }}>
+                    {chat ? <Chat handleChatc={handleChatc} sendMsg={sendMsg} singleChat={singleChat} recievedMsg={recievedMsg} setSingleChat={setSingleChat} roomCode={roomCode} /> : <div style={{ position: "fixed", bottom: "20px", right: "30px" }}>
                         <Button variant="primary" onClick={handleShowModal} size="lg" block>
                             생성
                         </Button>
@@ -88,11 +90,11 @@ function Home() {
                         <Button variant="secondary" onClick={handleShowEnter} size="lg" block>
                             참가
                         </Button>
-                    </div>
+                    </div>}
                 </Col>
             </Row>
             <RoomMake showModal={showModal} handleCloseModal={handleCloseModal} />
-            <EnterRoom showEnter={showEnter} enterChatRoom={enterChatRoom} handleCloseEnter={handleCloseEnter} handleChato={handleChato} setRoomName={setRoomName}/>
+            <EnterRoom showEnter={showEnter} enterChatRoom={enterChatRoom} handleCloseEnter={handleCloseEnter} handleChato={handleChato} setRoomName={setRoomName} />
         </>
     );
 }

server/controllers/room.controller.js

@@ -7,7 +7,7 @@ const nanoid = customAlphabet('1234567890abcdef', 10)
 const makeRoom = async (req, res) => {
     console.log(req.body)
     const { roomName, interest, isOpen, member } = req.body;
-    console.log('콘솔확인',roomName, interest, isOpen, member)
+    console.log('콘솔확인', roomName, interest, isOpen, member)
 
     const roomId = nanoid()
     const room = await Room.findOne({ roomId })
@@ -39,7 +39,7 @@ const makeRoom = async (req, res) => {
 
 const getClosedList = async (req, res) => {
     try {
-        console.log('req확인',req.query._id)
+        console.log('req확인', req.query._id)
         let list = await Room.find({ member: [req.query._id] })
         console.log('c_list가져오기', list)
         return res.json(list)

server/models/Chat.js

@@ -4,16 +4,18 @@ const { String } = mongoose.Schema.Types
 
 const ChatSchema = new mongoose.Schema({
     room: {
-        type: ObjectId,
+        type: mongoose.ObjectId,
         required: true,
         ref: 'Room',
     },
     username: {
         type: String,
         required: true,
-        ref: 'User',
     },
-    message: String,
+    message: {
+        type: String,
+        required: true
+    },
 }, {
     timestamps: true
 })

server/routes/room.routers.js

@@ -11,4 +11,6 @@ router.route('/room/closedlist')
 
 router.route('/room/openlist')
     .get(roomCtrl.getOpenList)
+
+
 export default router
\ No newline at end of file

server/server.js

-import express from 'express'
+import express, { response } from 'express'
 import connectDb from './utils/connectDb.js'
 import userRouter from './routes/user.routes.js'
 import authRouter from './routes/auth.routes.js'
@@ -8,6 +8,9 @@ import bodyParser from "body-parser";
 import http from "http";
 import { Server } from 'socket.io';
 import cors from "cors"
+import Room from './models/Room.js'
+import { nextTick } from 'process'
+import Chat from "./models/Chat.js"
 
 connectDb()
 
@@ -20,21 +23,31 @@ const io = new Server(server)
 io.on("connection", (socket) => { // 기본 연결
   console.log("socket connect ok", socket.id)
 
-  socket.on('joinRoom', (data)=>{ // joinRoom을 클라이언트가 emit했을 때
-    console.log('join_data확인',data)
-    let roomInfo=data;
+  socket.on('joinRoom', (data) => { // joinRoom을 클라이언트가 emit했을 때
+    console.log('join_data확인', data)
+    let roomInfo = data;
     socket.join(roomInfo); //클라이언트에서 data에 적힌 room으로 참여시킴
   });
 
-  socket.on('chat', (data) => {
+  socket.on('chat', async (data) => {
     console.log('roomname확인', data)
-    socket.broadcast.to(data.roomInfo).emit('sendedMSG', data.msg ); // sender 제외 특정 방으로
+    const room = await Room.findOne({ roomId: data.roomInfo })
+    console.log('room이 떴나', room)
 
-  });
+    const chat = await new Chat({
+      room: room._id,
+      username: data.username,
+      message: data.msg
+    }).save()
+    console.log('resChat확인', chat)
+    
+  socket.broadcast.to(data.roomInfo).emit('sendedMSG', data.msg); // sender 제외 특정 방으로
 
-  socket.on('disconnect', () => {
+});
+
+socket.on('disconnect', () => {
   console.log('disconnected from server id=', socket.id)
-  })
+})
 
 });