일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- merge
- lambda
- Class
- 중급파이썬
- crud
- dict
- async
- 채팅
- socket io
- NeXT
- pandas
- 튜플
- flask
- git
- docker
- RDS
- EC2
- SSA
- wetube
- Vue
- S3
- AWS
- Props
- SAA
- react
- TypeScript
- node
- 카톡
- 파이썬
- MongoDB
- Today
- Total
목록카톡 (3)
초보 개발자
상대방이 현재 들어와있는지 확인 어떻게 하면 상대방이 현재 들어와있는지 확인할 수 있을까..?라는 생각이 들었다. 소켓아이디는 쉽게 바뀔 수 있기 때문에 소켓아이디를 사용하면 힘들어질 것 같았다. 따라서 유저를 식별할 수 있는 유니크한 방을 하나 만들고 로그인하면 그 소켓 방으로 입장을 시킨다. 그 이후에 어떤 유저가 채팅방 목록에 들어갔을 때 소켓 방에 현재 사람이 존재하는지 유무를 체크하고 방에 있다면 로그인 했다는 것이므로 표시를 해주고, 존재하지 않다면 아무것도 안해주는 방식을 떠올렸다. 먼저 상대가 로그인을 하면 소켓 방에 입장해주는 코드이다. vuex에서 userId를 가져와서 만약 userId가 1이라면 1-2번방으로 입장을 시킨다. 1-1이 아닌 이유는 나는 1-1에는 다른 목적으로 사용하..
채팅방 내가 작성한 메시지는 오른쪽, 상대방은 왼쪽에 표시가 된다. 나는 채팅방을 만들 때 어떤식으로 구상을 했냐면, 채팅방에 입장한 순간 created로 설정을 여러개 해줄 것이다. 그 때 해당 채팅방의 기존 내역들을 db에서 불러와서 vuex에 배열로 저장해두고, 새로 채팅을 입력을 하면 또 그 내용을 vuex에 배열로 저장을 해줄 것이다. 그럼 2개의 배열이 존재할 것이고 그걸 getter로 불러와서 화면에 뿌려줄 것이다. 기존 채팅 내역 불러오기 처음에 채팅방에 들어오면 DB에서 해당 방에 존재하는 채팅들을 다 읽어온다. 그리고 vuex에 저장을 해둔다. 기존 채팅 내역들과, 새로 적은 채팅내용들을 리셋해주고, 상대방의 프사, 이름을 저장해준다. 그런 뒤에 받아온 채팅들을 하나씩 for문을 돌리면..
완성본 미리보기 2022.06.06 - [[ Node.js Vue.js Socket.io ] 채팅] - [ Node.js Vue.js Sockect.js ] 카톡 채팅 만들기 완성 내가 구현해보려고 하는 기능은 기본적인 채팅 기능에 더하여 여러가지가 있다. 1. DB를 사용하여 나갔다 들어와도 기존 채팅이 유지가 되어있어야 함 ✅ 2. 읽음표시 기능(실시간) ✅ 3. 카톡처럼 같은 시간에(분 단위)적히면 마지막 채팅만 시각이 적혀야함, ✅ 4. 채팅방 목록에 안읽은 채팅 개수와 마지막 채팅 , 마지막 채팅 시간, 프로필 사진 받기, ✅ 5. 채팅 삭제 기능, 상대방에게도 메시지가 바뀌어 보여야함 (실시간) ✅ 6. 사진 및 동영상 전송 기능, ✅ 7. 현재 상대방이 들어와있는지 표시할 수 있는 기능 ✅ ..