최시원 / Singer-Composer

Go to a project
Toggle navigation Toggle navigation pinning
Mukho
2731778e 1 parent 279d13be

Chatting On

Inline Side-by-side
Showing 15 changed files with 71 additions and 25 deletions
...@@ -75,17 +75,25 @@ app.use(router) // router 정의 ...@@ -75,17 +75,25 @@ app.use(router) // router 정의
75 75
76 // Socket.io 76 // Socket.io
77 io.sockets.on('connection', function(socket) { 77 io.sockets.on('connection', function(socket) {
78 - 78 + try{
79 /* 새로운 유저가 접속했을 경우 다른 소켓에게도 알려줌 */ 79 /* 새로운 유저가 접속했을 경우 다른 소켓에게도 알려줌 */
80 socket.on('newUser', function() { 80 socket.on('newUser', function() {
81 - console.log(logString + ' 님이 접속하였습니다.')
82 -
83 /* 소켓에 이름 저장해두기 */ 81 /* 소켓에 이름 저장해두기 */
84 - socket.name = socket.handshake.session.nickname; 82 + var tempSession = socket.handshake.sessionStore.sessions;
83 + var key = socket.handshake.sessionID;
84 +
85 + // tempSession[key] = String Type
86 + var useSession = JSON.parse(tempSession[key]);
87 + socket.name = useSession.passport.user.nickname
88 + console.log(logString + socket.name+' 님이 접속하였습니다.')
85 89
86 /* 모든 소켓에게 전송 */ 90 /* 모든 소켓에게 전송 */
87 io.sockets.emit('update', {type: 'connect', name: 'SERVER', message:socket.name + '님이 접속하였습니다.'}) 91 io.sockets.emit('update', {type: 'connect', name: 'SERVER', message:socket.name + '님이 접속하였습니다.'})
88 }) 92 })
93 + }
94 + catch{
95 + //
96 + }
89 97
90 /* 전송한 메시지 받기 */ 98 /* 전송한 메시지 받기 */
91 socket.on('message', function(data) { 99 socket.on('message', function(data) {
...@@ -100,7 +108,7 @@ io.sockets.on('connection', function(socket) { ...@@ -100,7 +108,7 @@ io.sockets.on('connection', function(socket) {
100 108
101 /* 접속 종료 */ 109 /* 접속 종료 */
102 socket.on('disconnect', function() { 110 socket.on('disconnect', function() {
103 - console.log(logString+socket.name + '님이 나가셨습니다.') 111 + console.log(logString+socket.name + ' 님이 나가셨습니다.')
104 112
105 /* 나가는 사람을 제외한 나머지 유저에게 메시지 전송 */ 113 /* 나가는 사람을 제외한 나머지 유저에게 메시지 전송 */
106 socket.broadcast.emit('update', {type: 'disconnect', name: 'SERVER', message: socket.name + '님이 나가셨습니다.'}); 114 socket.broadcast.emit('update', {type: 'disconnect', name: 'SERVER', message: socket.name + '님이 나가셨습니다.'});
......
...@@ -19,35 +19,47 @@ ...@@ -19,35 +19,47 @@
19 /* 접속 알림 */ 19 /* 접속 알림 */
20 .connect { 20 .connect {
21 width: 90%; 21 width: 90%;
22 - margin: auto; 22 + margin-left: 5%;
23 + margin-right: 5%;
24 + margin-top: 10px;
23 background-color: aquamarine; 25 background-color: aquamarine;
24 text-align: center; 26 text-align: center;
25 - margin-top: 10px; 27 + clear:both;
28 + float:center;
26 } 29 }
27 30
28 /* 접속 종료 알림 */ 31 /* 접속 종료 알림 */
29 .disconnect { 32 .disconnect {
30 width: 90%; 33 width: 90%;
31 - margin: auto; 34 + margin-left: 5%;
35 + margin-right: 5%;
36 + margin-top: 10px;
32 background-color: indianred; 37 background-color: indianred;
33 text-align: center; 38 text-align: center;
34 - margin-top: 10px; 39 + clear:both;
40 + float:center;
35 } 41 }
36 42
37 /* 내가 보낸 메시지 */ 43 /* 내가 보낸 메시지 */
38 .me { 44 .me {
39 - width: 90%;
40 - margin: auto;
41 background-color: lemonchiffon; 45 background-color: lemonchiffon;
42 border-radius: 5px; 46 border-radius: 5px;
43 margin-top: 10px; 47 margin-top: 10px;
48 + margin-left: 5%;
49 + margin-right: 5%;
50 + text-align: right;
51 + clear:both;
52 + float:right;
44 } 53 }
45 54
46 /* 상대방이 보낸 메시지 */ 55 /* 상대방이 보낸 메시지 */
47 .other { 56 .other {
48 - width: 90%;
49 - margin: auto;
50 background-color: white; 57 background-color: white;
51 border-radius: 5px; 58 border-radius: 5px;
52 margin-top: 10px; 59 margin-top: 10px;
60 + margin-left: 5%;
61 + margin-right: 5%;
62 + text-align: left;
63 + clear:both;
64 + float:left;
53 } 65 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -34,6 +34,12 @@ socket.on('update', function(data) { ...@@ -34,6 +34,12 @@ socket.on('update', function(data) {
34 message.classList.add(className) 34 message.classList.add(className)
35 message.appendChild(node) 35 message.appendChild(node)
36 chat.appendChild(message) 36 chat.appendChild(message)
37 +
38 + function a(chat = 'chat'){
39 + var element = document.getElementById(chat);
40 + element.scrollTop = element.scrollHeight - element.clientHeight;
41 + }
42 + a();
37 }) 43 })
38 44
39 /* 메시지 전송 함수 */ 45 /* 메시지 전송 함수 */
...@@ -41,6 +47,8 @@ function send() { ...@@ -41,6 +47,8 @@ function send() {
41 // 입력되어있는 데이터 가져오기 47 // 입력되어있는 데이터 가져오기
42 var message = document.getElementById('test').value 48 var message = document.getElementById('test').value
43 49
50 + // 공백이 아닐때
51 + if(message != ''){
44 // 가져왔으니 데이터 빈칸으로 변경 52 // 가져왔으니 데이터 빈칸으로 변경
45 document.getElementById('test').value = '' 53 document.getElementById('test').value = ''
46 54
...@@ -54,4 +62,6 @@ function send() { ...@@ -54,4 +62,6 @@ function send() {
54 62
55 // 서버로 message 이벤트 전달 + 데이터와 함께 63 // 서버로 message 이벤트 전달 + 데이터와 함께
56 socket.emit('message', {type: 'message', message: message}) 64 socket.emit('message', {type: 'message', message: message})
65 + }
66 +
57 } 67 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -61,16 +61,15 @@ create table board( ...@@ -61,16 +61,15 @@ create table board(
61 >UPDATE board SET idx = @COUNT:=@COUNT+1; 61 >UPDATE board SET idx = @COUNT:=@COUNT+1;
62 62
63 --- 63 ---
64 -### 최종 수정: 2021-11-25 14:15<br> 64 +### 최종 수정: 2021-11-25 17:57<br>
65 ### 수정 내용: 65 ### 수정 내용:
66 -0. 채팅기능에 버그가 있는 것 같음(undefined님이 나가셨습니다. -> 콘솔에 계속 출력됨) // socket.io의 express-session 호환 문제로 후순위 개발로 미룸 66 +0. 사용자-서버 채팅간 여백
67 -1. 로그에 시간/IP 추가 67 +0. 채팅 엔터키
68 +0. 채팅(socket) 사용 중 서버 재시작 시 서버 오류
69 +1. 채팅 구현
68 2. 시간 실시간 반영 70 2. 시간 실시간 반영
69 -3. 게시글 수정 및 삭제 세션+권한 연동/DB수정
70 -4. 버그 수정
71 -5. 게시글 조회수 구현
72 -6. 프로필 수정 세션 연동
73 -7. 프로필 사진 추가
74 -8. 프로필 검색 추가
75 -9. 프로필 비주얼 업데이트
76 -10. 코드 다듬음
...\ No newline at end of file ...\ No newline at end of file
71 +3. 프로필 사진 추가
72 +4. 프로필 검색 추가
73 +5. 프로필 비주얼 업데이트
74 +6. 코드 다듬음
75 +7. 버그 수정
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -39,4 +39,10 @@ router.get('/', function(req, res){ ...@@ -39,4 +39,10 @@ router.get('/', function(req, res){
39 } 39 }
40 }); 40 });
41 41
42 +function enterkey() {
43 + if (window.event.keyCode == 13) {
44 + // 엔터키가 눌렸을 때 실행할 내용
45 + send();
46 + }
47 +}
42 module.exports = router; 48 module.exports = router;
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -35,6 +35,7 @@ init() ...@@ -35,6 +35,7 @@ init()
35 // URL routing 35 // URL routing
36 // req = request, res = respond 36 // req = request, res = respond
37 router.get('/', function(req, res){ 37 router.get('/', function(req, res){
38 + try{
38 var ip = requestIp.getClientIp(req); 39 var ip = requestIp.getClientIp(req);
39 var id = req.user; 40 var id = req.user;
40 if(!id){ 41 if(!id){
...@@ -46,6 +47,10 @@ router.get('/', function(req, res){ ...@@ -46,6 +47,10 @@ router.get('/', function(req, res){
46 console.log(logString+req.user.ID+'('+nickname+') 유저가 작업 중입니다.('+ip+')') 47 console.log(logString+req.user.ID+'('+nickname+') 유저가 작업 중입니다.('+ip+')')
47 res.render('main.ejs', {'ID': id, 'nickname': nickname}); 48 res.render('main.ejs', {'ID': id, 'nickname': nickname});
48 } 49 }
50 + }
51 + catch{
52 + res.redirect('/main')
53 + }
49 }); 54 });
50 55
51 // router 정의 56 // router 정의
......
...@@ -108,7 +108,6 @@ router.post('/', function(req,res){ ...@@ -108,7 +108,6 @@ router.post('/', function(req,res){
108 }else{ 108 }else{
109 var profilepic = "../assets/img/noneprofilepic.png"; 109 var profilepic = "../assets/img/noneprofilepic.png";
110 } 110 }
111 - console.log(type)
112 console.log(logString+req.user.ID+'('+nickname+') 유저가 프로필 열람 중입니다.('+ip+')') 111 console.log(logString+req.user.ID+'('+nickname+') 유저가 프로필 열람 중입니다.('+ip+')')
113 res.render('other_profile.ejs', {'ID':id, 'nickname': nickname, 'type':type, 'profilemsg': profilemsg, 'message':'', 'profnickname': profnickname, 'profilepic':profilepic}); 112 res.render('other_profile.ejs', {'ID':id, 'nickname': nickname, 'type':type, 'profilemsg': profilemsg, 'message':'', 'profnickname': profnickname, 'profilepic':profilepic});
114 } 113 }
...@@ -279,4 +278,11 @@ function enterkey() { ...@@ -279,4 +278,11 @@ function enterkey() {
279 } 278 }
280 } 279 }
281 280
281 +function enterkey() {
282 + if (window.event.keyCode == 13) {
283 + // 엔터키가 눌렸을 때 실행할 내용
284 + send();
285 + }
286 +}
287 +
282 module.exports = router; 288 module.exports = router;
...\ No newline at end of file ...\ No newline at end of file
......