WIL7주차
이번 주 작업
웹 소캣 프로그래밍
HTTP처럼 stateless, 필요할 때만 연결하는 게 아닌 stateful, 항상 연결되어 있는 통신을 하게 해주면서 TCP보다는 간단하게 작성할 수 있는 통신 방식.
핸드셰이크
손에 손을 붙잡는 느낌으로 소켓 통신이 가능한지 확인하는 방법이며 현재 프로젝트에선 connect를 통해 보내고 있다.
//connection이란 게 발생할 때까지 대기한다.
io.on('connection', (socket) => {
//최초 커넥션이 맺어진 이후 계속 여기서 돌아간다.
const userUUID = uuidv4();
socket.on("event", (data)=>handleEvent(io,socket,data));
socket.on('disconnection', (socket)=>handleDisconnect(socket,userUUID));
})
연결은 브로드캐스트로 받고 있으며 개별 코드에 대해서 event와 disconnection을 실행하고 있다.
클라이언트 쪽에선 별도의 파일을 만들어서 관리하고 있다.
//localhost:3000으로 연결된 html 파일에서 연결 받는 것이고
//aws에 등록하면 이걸 바꿔야 할 수 있겠다.
//아마도 도메인을 할당하는 식으로 갈 것으로 보인다.
const socket = io('http://localhost:3000', {
query: {
clientVersion: CLIENT_VERSION,
},
});
let userId = null;
socket.on('response', (data) => {
console.log("responce");
console.log(data);
if(typeof data.id !== 'undefined')
{
const responseHandler = handlerMappings[data.id];
const response = responseHandler(data.payload);
}
});
socket.on('connection', (data) => {
// console.log('connection: ', data);
// console.log("시작시에 전송됨")
userId = data.uuid;
});
socket.on('disconnection', (data) =>{
if(data.status !== 'success')
{
console.log("아이디 지워짐")
}
})
//받을 필요가 있는가 확인해야 하나.
socket.on('event', (data) => {
if(data.status==='success')
{
//data에 아이디를 보내고 그걸로 맵핑한다.
const handler = handlerMappings[data.id];
if(!handler)
{
console.log("핸들 없음");
return;
}
//console.log("확인");
// if(!data['payload'])
// {
// console.log("데이터 없음");
// }
// else
// {
// console.log(data['payload'])
// }
if(data.payload)
{
const response = handler(data.payload);
}
return data;
}
else
{
console.log("이벤트 연결 실패");
}
//const handler = handlerMappings[data]
console.log(data);
})
//확인 중
const sendEvent = (handlerId, payload) => {
socket.emit('event', {
userId,
clientVersion: CLIENT_VERSION,
handlerId,
payload,
});
};
export { sendEvent };
다음 주 목표
현재 작업하고 있는 건 로컬 저장소의 json에서 작업하는 걸 parse 해서 작업하고 있는데 redis라는 데이터베이스를 경유하면 좀 더 빠르게 테이블을 세팅할 수 있어 보인다. 브로드캐스팅이 미흡한 부분을 수정하고 난 다음엔 테이블을 작성해 볼 예정이다. 사이트에 들어가면 돈을 내야 된다고 보였는데 무료 방법도 있다고 하니 그 쪽을 알아봐야겠다.
기본적인 작업들은 완료가 되었으나 랭킹 설정 등을 위해서 브로드캐스팅을 보내야 하는 문제가 남았다.
const response = handler(data.userId, data.payload);
if(response.broadcast)
{
//여긴 브로드캐스팅을 보내는 함수
io.emit('response', {id : 2, payload : {score : RankOneScore()}});
return;
}
현재 broadcast를 쓸 경우는 점수를 받은 다음 그 점수가 랭킹 1위의 점수일 때 사용자들의 최고 점수를 수정하는 방식을 사용하려 하는데, 클라이언트 부분에서 게임을 시작할 때 충돌이 일어날 수 있어 아직 연구 중이다.
해당 코드에선 return 받은 값 안에 broadcast를 집어 넣어서 판별을 하고 있는데, 이 코드는 작업 후 용량을 줄이기 위해 broadcast라는 부분을 제거한 다음에 보내도록 하자. 조금의 용량이라도 효율적으로 보내는 게 좋지.