게임 개발 공부 2일차 웹서버와 다른 구조

1. 데이터 테이블 로드

파일시스템을 사용하여 서버에서 필요한 데이터 테이블을 메모리에 로드할 수 있다. Node.js의 fs 모듈은 파일 시스템에 접근하고 파일을 읽고 쓰는 기능을 제공합니다. 동기적·비동기적 방식 모두로 파일 I/O작업을 수행할 수 있고, 파일 생성, 읽기, 쓰기, 삭제, 수정 등의 작업을 할 수 있어 다양한 형태의 파일기반 작업을 가능케 한다. 데이터 테이블의 관리 방법은 여러가지가 있는데, DB, CDN, file 등의 형태로 관리하게 된다. file의 형식으로 프로젝트를 진행했는데, 파일을 json형식으로 제공하고 그 파일을 지정해 그 파일의 내용을 사용할 수 있게 된다.

1) 최상위폴더에 assets 폴더를 만들어 json파일을 넣는다. 소스코드가 아니니 src 밖에 위치한다.

2) assets.js 파일에 gameAssets를 전역변수로 선언한다

3) 비동기 병렬 처리를 위해 fs 메서드에 Promise를 적용한다.

4) 읽은 데이터 테이블을 서버 메모리에 로드한다.

5) app.js에 server.listen 메서드 내부에 try-catch문으로 loadGameAssets 함수를 넣어준다.

 

2 .유저 접속 관리

유저가 최초에 등록할 때 uuid를 부여하고 socketId는 접속할 때마다 연결되는 소켓을 구별하는 것이다. 

Current users: [
  {
    uuid: 'aaaaa-bbbbb-ccccc-dddd-sdfsfdfs',
    socketId: 'UQMGDFJKGH12KLDFHKSJDL'
  }
]

• 서버와 클라이언트 간의 네트워크 연결을 가능케 하는 핵심 도구인 소켓
• 소켓 ID는 이러한 연결에서 각 소켓의 고유식별자로 사용
• 고유한 값인 소켓 ID를 통해 각 클라이언트의 연결 상태를 구분, 관리하는 것이 중요

이벤트를 처리하는 함수를 핸들러라고 하는데, 그 핸들러들을 서버에 등록해주는 함수를 만들었다.

1) src 내부에 handlers 폴더를 만들어 registerHandler 함수를 선언

2) socket.js에서 registerHandler 함수를 호출한다.

 

3. 유저모델

유저가 접속하면 정보를 저장하기도 하고 삭제하기도 해야하니 데이터의 CRUD와 관련된 메서드 및 함수는 model이라는 이름으로 관리한다.

1) model \ user.model.js 파일을 생성하고 users 배열을 전역적으로 선언한다. 다음 addUser와 getUser 함수를 넣는다.

2) register.handler.js에 addUser 함수를 호출해 유저 정보를 저장한다. 이때 uuid 라이브러리를 받고 uuidv4 메서드를 사용해 uuid를 생성해 등록할 때 함께 생성한다.

3) 유저가 접속해제 했을 때 서버 메모리에서 유저를 삭제해야한다. user.model.js에서 유저를 삭제하는 함수를 선언하고 다시 register.handler.js에 넣어준다.

4) handers 폴어에 helper.js 파일을 생성하는데, 컨텐츠 외에 필수 이벤트 처리 핸들러들이 선언될 파일이다. disconnect 이벤트를 처리해줄 함수를 선언한다. 

 

위와 같은 프로세스로 websocket을 통한 간단한 유저 관리가 진행되었다. 게임의 규모가 커지면 핸들러가 많아질텐데 각 핸들러에 고유 ID를 부여하여 호출하는 기법이다. handlertEvent함수는 여러 역할을 동시에 수행할 수 있는데, 클라이언트 버전 체크, 핸들러 맵핑, 유저에게 메시지 전송이 있다. 이것은 다음에 알아보기로 하자.

 

4. 클라이언트 연동

1. public 폴더를 최상위폴어에 넣고 express의 static 메서드를 사용해 정적파일을 서빙할 수 있게 설정한다.

app.use(express.static('public'));

이 코드를 app.js에 추가해주면 npm run dev를 통해 서버를 구동한후 localhost:3000을 통해 게임에 접속 할 수있다.

 

2. 그리고 public에 Constants.js 파일을 생성, 클라이언트 버전을 명시해준다. Socket.js를 생성한 후 버전을 포함한 코드를 작성한다. 그리고 index.js에 Socket.js를 import하면 된다.

// Contants.js
export const CLIENT_VERSION = '1.0.0';

// index.js
import './Socket.js