[Node.js] 채팅 - 1. 채팅방

1. 채팅 버튼 만들기 +  버튼 클릭 시 채팅방 작성자 정보 server로 전송하기

 

<list.ejs>

<button class="btn btn-secondary chat" data-id="<%= posts[i].writer %>">채팅</button>

 $('.chat').click(function (e) {
    var id = e.target.dataset.id;
    $.post('/chatroom', { 채팅받은유저id: id }).then(() => {
        console.log('성공');
    });
});

 

 

2. monggodb에 컬렉션 추가

3. server에서 채팅방 정보 DB에 저장하기

<server.js>

const { ObjectId } = require('mongodb');

app.post('/chatroom', 로그인했니, function (요청, 응답) {
    var 저장할거 = {
        title: '뫄뫄채팅방',
        // member: [요청.body.채팅받은유저id, 요청.user._id], // 이렇게 쓰면 0번째거 string으로 나옴
        member: [ObjectId(요청.body.채팅받은유저id), 요청.user._id], // ObjectId() 사용 시 ObjectId에 담김
        date: new Date(),
    };
    db.collection('chatroom')
        .insertOne(저장할거)
        .then((결과) => {
            응답.send('성공');
        });
});

 

4. 채팅방 페이지 만들기

<chat.ejs>

<h4 class="container mt-4"><strong>채팅방</strong></h4>
<div class="container p-4 detail">
    <div class="row">
        <div class="col-3">
            <ul class="list-group chat-list">
                <% for (var i=0; i < data.length ; i++){ %>
                <li class="list-group-item" data-id="<%= data[i]._id %>">
                    <h6><%= data[i].title %></h6>
                    <h6 class="text-small"><%= data[i].member[0] %></h6>
                </li>
                <% } %>
            </ul>
        </div>
    </div>
</div>

 

<server.js>

app.get('/chat', 로그인했니, function (요청, 응답) {
    db.collection('chatroom')
        .find({ member: 요청.user._id })
        .toArray()
        .then((결과) => {
            console.log(결과);
            응답.render('chat.ejs', { data: 결과 });
        });
});