[typescript] async/await와 함께 사용하는 웹 소켓 통신 처리 방법
이 블로그 포스트에서는 TypeScript와 async/await를 사용하여 웹 소켓을 효과적으로 다루는 방법에 대해 살펴보겠습니다.
1. 웹 소켓 라이브러리 설치
우선, 웹 소켓 통신을 위해 npm을 사용하여 WebSocket 라이브러리를 설치해야 합니다.
npm install ws
2. 웹 소켓 연결 설정
다음으로, WebSocket 라이브러리를 사용하여 서버와의 웹 소켓 연결을 설정해야 합니다. 이때, async/await를 사용하여 비동기적으로 연결을 처리할 수 있습니다.
import WebSocket from 'ws';
const connectWebSocket = async (): Promise<WebSocket> => {
return new Promise((resolve, reject) => {
const ws = new WebSocket('ws://서버주소:포트');
ws.on('open', () => {
console.log('웹 소켓 연결 성공');
resolve(ws);
});
ws.on('error', (err) => {
reject(err);
});
});
};
const ws = await connectWebSocket();
3. 웹 소켓 메시지 송수신
웹 소켓 연결이 설정되면, async/await를 사용하여 메시지를 송수신할 수 있습니다.
const sendMessage = async (ws: WebSocket, message: string): Promise<void> => {
return new Promise((resolve) => {
ws.send(message, (err) => {
if (err) {
console.error('메시지 전송 에러:', err);
} else {
console.log('메시지 전송 성공');
}
resolve();
});
});
};
const receiveMessage = async (ws: WebSocket): Promise<string> => {
return new Promise((resolve) => {
ws.on('message', (data) => {
console.log('메시지 수신:', data);
resolve(data.toString());
});
});
};
// 메시지 송신 예시
await sendMessage(ws, '안녕, 서버!');
// 메시지 수신 예시
const receivedMessage = await receiveMessage(ws);
4. 웹 소켓 연결 해제
마지막으로, 웹 소켓 통신 후에는 연결을 명시적으로 해제해야 합니다.
const closeWebSocket = async (ws: WebSocket): Promise<void> => {
return new Promise((resolve) => {
ws.on('close', () => {
console.log('웹 소켓 연결 해제');
resolve();
});
ws.close();
});
};
// 웹 소켓 연결 해제
await closeWebSocket(ws);
이처럼, TypeScript에서 async/await를 활용하여 웹 소켓 통신을 처리할 수 있습니다. 이를 통해 코드의 가독성과 유지보수성이 향상되며, 비동기 작업을 보다 쉽게 다룰 수 있습니다.