kagan-draca 님의 블로그

2-4 프로토 파일 로드

1) protobufjs 간단 사용법1. 프로토콜 버퍼 정의 파일 작성하기 먼저, 최상위 폴더에 protobuf 파일을 만들고, request와 response 폴더를 만듭니다.request 폴더에는 common.proto 파일을 생성해주고, syntax = 'proto3';package common;message Package{    uint32 handlerId =1;    string userId = 2;    string clientVersion =3;    uint32 sequence = 4;    byte payload = 5;}위의 내용은 클라이언트가 서버에 내용을 보내기 위한 내용들로 어떠한 이벤트가 "어떠한 handlerId로 유저가 clientVersion과 sequence를 가지고 요..

2-3 (중요)이벤트 구분, 바이트 배열 분해

1. 이벤트, 패킷 헤더이벤트를 구분해서 관리할 수 있다.바이트 배열에서 패킷 헤더를 구분할 수 있다. 1) 소켓 이벤트 분리하기const server = net.createServer((socket) => {  console.log(`Client connected from ${socket.remoteAddress} : ${socket.remotePort}`);  socket.on('data', (data) => {    console.log(data);  });  socket.on('end', () => {    console.log('Client disconnected');  });  socket.on('error', (err) => {    console.error('Socket error : ',..

2-2 중앙집중식 환경변수 관리

1. 중앙 집중식 관리모든 환경 변수와 상수는 한 곳에서 관리, 다른 파일에서 동일한 값을 사용하여도 일관성을 유지변경이 필요할 때 한 곳에서만 수정하면 된다.환경 변수, 상수의 직접 사용이 아니기 때문에 코드가 명확해지는 효과필요한 경우 개발, 테스트, 프로덕션 환경 별로 다른 설정 사용이 가능하다. src 폴더에 constans폴더를 생성하고 env.js 파일을 만들어줍니다. 그리고, .env 파일을 만들어 줍니다. .env 파일 안에는PORT = 3000HOST = 127.0.0.1CLIENT_VERSION = 1.0.0위와 같이 서버의 주소(HOST), 포트 번호(PORT), CLIENT_VERSION 이 들어갑니다. env.js 파일은 .env 파일에 있는 정보들을 process로 부터 가져와 ..

2-1 실전 게임 서버 만들기

1. 사용할 라이브러리들 1) dotenvdotenv는 환경 변수를 .env 파일에 저장하고 이를 Node.js 어플리이케션에 로드개발자가 코드에서 직접 환경 변수를 설정하는 대신 별도의 파일로 관리할 수 있게 해줍니다.2) lodahJavaScript의 유틸리티 라이브러리배열, 객체, 함수 등의 데이터 처리를 위한 당양한 기능을 제공선응이 뛰어나고 코드의 가독성을 높이는 데 유용3) mysql2MySQL 데이터 베이스와 상호 작용하기 위한 Node.js 클라이언트 라이브러리4) protobufjsGoogle의 Protocol Buffers(포로토콜 버퍼)를 사용하여 데이터 직렬화 및 역직렬화를 지원하는 라이브러리add) 직렬화 : 메모리를 디스크에 저장하거나 네트워크 통신에 사용하기 위한 형식으로 변환..

1. 어떤 핸들러와 조건을 설정할 것인가? 핸들러핸들러 ID작업10소문자를대문자로 변경11데이터를 역순으로 변경 제한 조건메시지의 크기가 1024 바이트 보다 큰 경우에는 에러 반환 이후 커넥션 해제 2. 제한된 크기를 설정해줬기 때문에 Server에서 Client가 범위 내 메시지 보냈는지 확인하기 먼저, constant.js에서export const MAX_MESSAGE_LENGTH = 1024;// Clinet가 서버로 보낼 메시지 가능 최대 길이위와 같이 메시지 제한 크기를 작성해줍니다. 수정된 이후 : export const TOTAL_LENGTH_SIZE = 4;export const HANDLER_ID = 2;export const MAX_MESSAGE_LENGTH = 1024;// Clin..

1. 패킷 구조 설계하기기존에 Web Socket Server 통신 설계에서는 위와 같은 데이터 구조로 설계를 했다면 TCP Server 통신 설계에서는위와 같은 데이터 구조로 크기라는 항목이 추가 돼 있습니다. 각각의 크기는totalLength는 4Byte, handlerId는 2Byte, message는 가변(어떤 데이터냐에 따라 다르기 때문에 가변)인 크기를 가집니다. message에는 String 타입의 값이 들어오게 되고, 간단한 예시로 데이터 교환을 확인해보겠습니다.위와 같이 Byte 배열이 들어왔을 때, 앞에서 4Byte 만큼이 TotalLength 입니다. 그럼 왼쪽에서부터 4개의 Byte가 TotalLength 가 됩니다. HandlerId는 2Byte이므로TotalLength 이후의 2..

1. Client => Server로 데이터 전송 및 Server  => Client로 데이터 반환client의client.connect(PORT, HOST, () => {  console.log('Connected To The Server...');});부분에서  수정 후 : client.connect(PORT, HOST, () => {  // 서버와 연결 과정  console.log('Connected To The Server...');  const message = 'Hello';  const buffer = Buffer.from(message);  // 서버 연결과 동시에 Hello라는 문자열을 버퍼에 담는다.  client.write(buffer);  // 서버에게 buffer를 data로 전송..

1. 바이트 배열8비트 단위의 데이터 배열, 각 요소는 0 ~ 255 사이의 정수 값을 가집니다.(1바이트) 8비트  = 1 바이트12864321684210 또는 10 또는 10 또는 10 또는 10 또는 10 또는 10 또는 10 또는 1 그래서 경우의 수를 따져 보면  사이의 값이 들어갈 수 있습니다. 그리고 바이트 배열은 45, 65, 6c, 6f 22 ...   형식으로 16진수로 표현 됩니다. 16 진수로 표현되는 이유는 컴퓨터의 바이너리 배열은 대부분 16진수로 이뤄지기 때문입니다. 2. 바이트  배열 용도이진 데이터 : 이미지, 데이터, 동영상, 네트워크 패킷 등을 표현할 때 사용됩니다.효율적인 메모리 사용과 빠른 데이터 전송이 가능합니다. 3. Buffer 객체 Buffer 객체는 Node..

Vscode에서 해당 디렉토리에 접근한다. 해당 디렉토리에서 터미널을 열고 yarn init -y 를 입력한다. package.json 파일들어가  "type" : "module"을 추가한다. 다시 터미널로 돌아와yarn add - D prettier로 패키지를 받고, .prettierrc 파일을 만들어줍니다. .prettierrc 파일에는 아래와 같이 복사해 붙여 넣어줍니다.{  "singleQuote": true,  "semi": true,  "useTabs": false,  "tabWidth": 2,  "trailingComma": "all",  "printWidth": 100,  "arrowParens": "always",  "orderedImports": true,  "bracketSpacing..

app.use(express.static('public'));는 서버가 public  디렉토리의 파일을 정적으로 제공해클라이언트가 public 폴더에 있는 파일을 직접 요청할 수 있게 해줍니다. 하지만,app.use(express.static('public'));사용해 public 폴더 안 파일에서 즉, 클라이언트 부분.js 파일에서 json 파일을 읽어와야 할 경우   Failed to load module script: The server responded with a non-JavaScript MIME type of “경로/json”. Strict MIME type checking is enforced for module scripts per HTML spec.  와 같이 JavaScript형식 서..