최시원 / 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 100 additions and 54 deletions
......@@ -75,17 +75,25 @@ app.use(router) // router 정의
// Socket.io
io.sockets.on('connection', function(socket) {
/* 새로운 유저가 접속했을 경우 다른 소켓에게도 알려줌 */
socket.on('newUser', function() {
console.log(logString + ' 님이 접속하였습니다.')
/* 소켓에 이름 저장해두기 */
socket.name = socket.handshake.session.nickname;
/* 모든 소켓에게 전송 */
io.sockets.emit('update', {type: 'connect', name: 'SERVER', message:socket.name + '님이 접속하였습니다.'})
})
try{
/* 새로운 유저가 접속했을 경우 다른 소켓에게도 알려줌 */
socket.on('newUser', function() {
/* 소켓에 이름 저장해두기 */
var tempSession = socket.handshake.sessionStore.sessions;
var key = socket.handshake.sessionID;
// tempSession[key] = String Type
var useSession = JSON.parse(tempSession[key]);
socket.name = useSession.passport.user.nickname
console.log(logString + socket.name+' 님이 접속하였습니다.')
/* 모든 소켓에게 전송 */
io.sockets.emit('update', {type: 'connect', name: 'SERVER', message:socket.name + '님이 접속하였습니다.'})
})
}
catch{
//
}
/* 전송한 메시지 받기 */
socket.on('message', function(data) {
......@@ -100,7 +108,7 @@ io.sockets.on('connection', function(socket) {
/* 접속 종료 */
socket.on('disconnect', function() {
console.log(logString+socket.name + '님이 나가셨습니다.')
console.log(logString+socket.name + ' 님이 나가셨습니다.')
/* 나가는 사람을 제외한 나머지 유저에게 메시지 전송 */
socket.broadcast.emit('update', {type: 'disconnect', name: 'SERVER', message: socket.name + '님이 나가셨습니다.'});
......
......@@ -19,35 +19,47 @@
/* 접속 알림 */
.connect {
width: 90%;
margin: auto;
margin-left: 5%;
margin-right: 5%;
margin-top: 10px;
background-color: aquamarine;
text-align: center;
margin-top: 10px;
clear:both;
float:center;
}
/* 접속 종료 알림 */
.disconnect {
width: 90%;
margin: auto;
margin-left: 5%;
margin-right: 5%;
margin-top: 10px;
background-color: indianred;
text-align: center;
margin-top: 10px;
clear:both;
float:center;
}
/* 내가 보낸 메시지 */
.me {
width: 90%;
margin: auto;
background-color: lemonchiffon;
border-radius: 5px;
margin-top: 10px;
margin-left: 5%;
margin-right: 5%;
text-align: right;
clear:both;
float:right;
}
/* 상대방이 보낸 메시지 */
.other {
width: 90%;
margin: auto;
background-color: white;
border-radius: 5px;
margin-top: 10px;
margin-left: 5%;
margin-right: 5%;
text-align: left;
clear:both;
float:left;
}
\ No newline at end of file
......
......@@ -11445,4 +11445,4 @@ footer.footer {
}
.info{
}
\ No newline at end of file
}
......
......@@ -34,6 +34,12 @@ socket.on('update', function(data) {
message.classList.add(className)
message.appendChild(node)
chat.appendChild(message)
function a(chat = 'chat'){
var element = document.getElementById(chat);
element.scrollTop = element.scrollHeight - element.clientHeight;
}
a();
})
/* 메시지 전송 함수 */
......@@ -41,17 +47,21 @@ function send() {
// 입력되어있는 데이터 가져오기
var message = document.getElementById('test').value
// 가져왔으니 데이터 빈칸으로 변경
document.getElementById('test').value = ''
// 공백이 아닐때
if(message != ''){
// 가져왔으니 데이터 빈칸으로 변경
document.getElementById('test').value = ''
// 내가 전송할 메시지 클라이언트에게 표시
var chat = document.getElementById('chat')
var msg = document.createElement('div')
var node = document.createTextNode(message)
msg.classList.add('me')
msg.appendChild(node)
chat.appendChild(msg)
// 서버로 message 이벤트 전달 + 데이터와 함께
socket.emit('message', {type: 'message', message: message})
// 내가 전송할 메시지 클라이언트에게 표시
var chat = document.getElementById('chat')
var msg = document.createElement('div')
var node = document.createTextNode(message)
msg.classList.add('me')
msg.appendChild(node)
chat.appendChild(msg)
// 서버로 message 이벤트 전달 + 데이터와 함께
socket.emit('message', {type: 'message', message: message})
}
}
\ No newline at end of file
......
......@@ -61,16 +61,15 @@ create table board(
>UPDATE board SET idx = @COUNT:=@COUNT+1;
---
### 최종 수정: 2021-11-25 14:15<br>
### 최종 수정: 2021-11-25 17:57<br>
### 수정 내용:
0. 채팅기능에 버그가 있는 것 같음(undefined님이 나가셨습니다. -> 콘솔에 계속 출력됨) // socket.io의 express-session 호환 문제로 후순위 개발로 미룸
1. 로그에 시간/IP 추가
0. 사용자-서버 채팅간 여백
0. 채팅 엔터키
0. 채팅(socket) 사용 중 서버 재시작 시 서버 오류
1. 채팅 구현
2. 시간 실시간 반영
3. 게시글 수정 및 삭제 세션+권한 연동/DB수정
4. 버그 수정
5. 게시글 조회수 구현
6. 프로필 수정 세션 연동
7. 프로필 사진 추가
8. 프로필 검색 추가
9. 프로필 비주얼 업데이트
10. 코드 다듬음
\ No newline at end of file
3. 프로필 사진 추가
4. 프로필 검색 추가
5. 프로필 비주얼 업데이트
6. 코드 다듬음
7. 버그 수정
\ No newline at end of file
......
......@@ -39,4 +39,10 @@ router.get('/', function(req, res){
}
});
function enterkey() {
if (window.event.keyCode == 13) {
// 엔터키가 눌렸을 때 실행할 내용
send();
}
}
module.exports = router;
\ No newline at end of file
......
......@@ -35,16 +35,21 @@ init()
// URL routing
// req = request, res = respond
router.get('/', function(req, res){
var ip = requestIp.getClientIp(req);
var id = req.user;
if(!id){
console.log(logString+'익명의 유저가 작업 중입니다.('+ip+')')
res.sendFile(path.join(__dirname, "../public/main.html"))
try{
var ip = requestIp.getClientIp(req);
var id = req.user;
if(!id){
console.log(logString+'익명의 유저가 작업 중입니다.('+ip+')')
res.sendFile(path.join(__dirname, "../public/main.html"))
}
if(id){
var nickname = req.user.nickname;
console.log(logString+req.user.ID+'('+nickname+') 유저가 작업 중입니다.('+ip+')')
res.render('main.ejs', {'ID': id, 'nickname': nickname});
}
}
if(id){
var nickname = req.user.nickname;
console.log(logString+req.user.ID+'('+nickname+') 유저가 작업 중입니다.('+ip+')')
res.render('main.ejs', {'ID': id, 'nickname': nickname});
catch{
res.redirect('/main')
}
});
......
......@@ -108,7 +108,6 @@ router.post('/', function(req,res){
}else{
var profilepic = "../assets/img/noneprofilepic.png";
}
console.log(type)
console.log(logString+req.user.ID+'('+nickname+') 유저가 프로필 열람 중입니다.('+ip+')')
res.render('other_profile.ejs', {'ID':id, 'nickname': nickname, 'type':type, 'profilemsg': profilemsg, 'message':'', 'profnickname': profnickname, 'profilepic':profilepic});
}
......@@ -279,4 +278,11 @@ function enterkey() {
}
}
function enterkey() {
if (window.event.keyCode == 13) {
// 엔터키가 눌렸을 때 실행할 내용
send();
}
}
module.exports = router;
\ No newline at end of file
......