01. Django Channels를 이용한 실시간 채팅 구현 - 밑준비

안녕하세요.
사실 'Zero부터 시작하는 Django 웹사이트 만들기' 시리즈도 이 Django Channels에 관한 내용을 적고 싶어서 시작하게 되었습니다.
 
다만 저 시리즈에서 모든걸 설명하면서 오기에는 너무 긴 시간이 걸릴것 같아 이쪽 부분은 별도로 분리해서 끄적여보고자 합니다.
 
앞으로의 포스팅도 이런식으로 모듈마냥 여러 포스트들을 주제별로 분리해서 하나로 합치는 방식으로 고민해봐야겠습니다.
 
(제가 작성한 코드는 비전공자에 독학이라 코드가 깔끔하지 않을 수 있습니다. 특히 DB 구조는 정규화를 거의 고려하지 않은 설계를 적용해서 현업 개발자들이 보시기엔 이가 갈릴 수도 있습니다. 모든 지적/질문은 감사히 받겠습니다.)
 
 

1. 기능 설명

---

 
이 포스트에서 구현하고자 하는 기능적 요소들은 아래와 같습니다.

• 웹사이트 내 실시간 1대1 DM 전송 기능
• 실시간 댓글/대댓글/인기글 선정 알림 기능
• 차단한 사용자로부터 발생하는 DM/알림은 수신하지 않게 설정

 
또한 비기능적 요소 목표는 아래와 같습니다.

• async를 이용한 비동기방식 처리를 통해 성능 향상
• 허가되지 않은 사람들의 1대1 채팅방 접근 방지

이 중, 제가 이 포스팅에서 비중을 들여 설명하고 싶은건 비동기 방식의 구현입니다.
 
사실 이전에 구현할 때는 참고 자료도 찾기 힘들어 동기 방식으로 구현했습니다만 아무래도 성능이 아쉬워서 이래저래 비동기 방식으로 뜯어고쳐보니 채팅 로딩도, 실시간 채팅 처리도 체감할만하게 더 빨라졌습니다.
로컬 환경에서 이정도였으니, 실제 서비스 작동에서는 현저히 차이가 날 것 같네요.
 
막연하게 이렇게 얘기하는 것보단 실제 구동 모습을 한번 볼까요?

채팅방 모습

채팅창/알림창 로비 모습

 
 
 

2. 필요 요소 설치

---

 
이미 이 정보가 필요하신 분들은 어느정도 Django에 관한 지식이 있을 것이기도 하고, 이 부분은 다른 분들의 포스팅에도 많이 있으므로 간략하게 설명하겠습니다.
 

• Django Channels 설치
  • pip install channels
  • pip install channels-redis
• Daphne ASGI 설치
  • pip install daphne
• Redis 설치
  • Windows의 경우 아래의 링크를 참조해주세요
  • https://github.com/tporadowski/redis/releases
  • Linux의 경우는 sudo apt install redis-server 명령어로 설치할 수 있습니다.

Releases · tporadowski/redis

• Redis의 경우, 3.X 버전으로 사용하면 Django Channels랑 호환성 이슈가 있었습니다. 꼭 위의 5.0.14버전 이상으로 설치해주세요!

 
 

3. settings.py 설정

---

1) INSTALLED_APPS 에 'daphne'와 'channels'를 추가해주세요.

INSTALLED_APPS = [

    'daphne', # 추가

    'users.apps.UsersConfig',

    'main.apps.MainConfig',

    'django.contrib.admin',

    'django.contrib.auth',

    'django.contrib.contenttypes',

    'django.contrib.sessions',

    'django.contrib.messages',

    'django.contrib.staticfiles',

    'django.contrib.humanize',

    'channels', # 추가

    'django_cleanup.apps.CleanupConfig',

]

settings.py

 
2) ASGI_APPLICATION 이란 항목을 새로 작성하셔서 (Config Application 이름).asgi.application이라고 적어줍시다.
 

WSGI_APPLICATION = 'itopia.wsgi.application'

ASGI_APPLICATION = 'itopia.asgi.application'

settings.py

 
 
앞으로 나오는 'itopia'라는 글자 대신 여러분들의 Django 설정이 들어있는(settings.py가 위치한 폴더 이름) 애플리케이션 이름을 적으시면 됩니다.
 
3) CHANNEL_LAYERS 항목을 새로 작성하셔서 Redis Channel Layer에 관한 설정을 아래와 같이 해줍시다.

CHANNEL_LAYERS = {

    "default": {

        "BACKEND": "channels_redis.core.RedisChannelLayer",

        "CONFIG": {

            "hosts": [("127.0.0.1", 6379)],

        },

    },

}

settings.py

 

4. asgi.py, routing.py, consumers.py

---

제 프로젝트 폴더의 구조는 아래 사진을 참조해주세요.

itopia(config), main, users의 세개의 앱으로 구성되어 있습니다.

 
이제 asgi.py에 아래와 같이 작성해봅시다.

import os

from channels.auth import AuthMiddlewareStack

from channels.routing import ProtocolTypeRouter, URLRouter

from channels.security.websocket import AllowedHostsOriginValidator

from django.core.asgi import get_asgi_application

from main.routing import websocket_urlpatterns

os.environ.setdefault('DJANGO_SETTINGS_MODULE' ,'itopia.settings')

django_asgi_app = get_asgi_application()

application = ProtocolTypeRouter(

    {

        "http": django_asgi_app,

        "websocket": AllowedHostsOriginValidator(

            AuthMiddlewareStack(URLRouter(websocket_urlpatterns))

        ),

    }

)

 

asgi.py

 
여기서 'from main.routing import websocket_urlpatterns'
이 라인은 저희가 아직 'main' 애플리케이션에 routing.py를 추가하지 않아 에러가 뜰겁니다.
 
앞으로 넘어가기 전에, Django WebSocket 통신의 핵심적인 기능을 하는 두 가지 모듈의 역할을 한번 알아보고 갑시다.
 
routing.py는 WebSocket 프로토콜로 들어오는 요청을 Django의 어떤 모듈이 처리해줄지 이어주는 역할을 합니다.
즉, urls.py와 역할이 비슷하다고 보시면 됩니다.
 
consumers.py는 WebSocket 프로토콜에서 사용하는 views.py 정도로 이해하시면 됩니다. 여기에 있는 클래스와 함수들이 웹소켓 연결과 통신 내용들을 처리합니다.
 
그렇다면 routing.py와 consumers.py를 한번 만들고 작성해봅시다.
채팅 기능을 넣고 싶은 애플리케이션에 routing.py를 새로 만들어줍시다. 새로운 애플리케이션으로 분리하고 싶다면 분리하셔도 무방합니다. 저는 main.py에 다 때려넣겠습니다.
 

main 앱에 다 작성해주겠습니다.

 
routing.py는 아래와 같이 작성해줍시다.

from django.urls import re_path, path

from . import consumers

websocket_urlpatterns = [

    re_path(r"ws/chat/(?P<room_id>\w+)/$", consumers.ChatConsumer.as_asgi()),

]

routing.py
 

마찬가지로, consumers.py를 작성하지 않았다면 ' from . import consumers' 라인에서 오류가 날겁니다.
consumers.py도 만들어서 아래와 같이 적어봅시다.
 
저희는 여기서 개발 목표에서 정했던 비동기 방식을 적용해볼겁니다. 대부분의 예제들이 WebSocketConsumer를 이용하지만 저희는 AsyncWebsocketConsumer를 import해서 적용해봅시다.

import json

import asyncio

from asgiref.sync import async_to_sync

from channels.generic.websocket import AsyncWebsocketConsumer

from channels.layers import get_channel_layer

from channels.db import database_sync_to_async

 

class ChatConsumer(AsyncWebsocketConsumer):

    async def connect(self):

        self.room_id = self.scope["url_route"]["kwargs"]["room_id"]

        self.room_group_name = f"chat_{self.room_id}"

 

        # Room 에 참가

        await self.channel_layer.group_add(

            self.room_group_name, self.channel_name

        )

        await self.accept()

 

    async def disconnect(self, code):

        await self.channel_layer.group_discard(

            self.room_group_name, self.channel_name

        )

 

# --------------- 메시지를 보낼 때 -----------------

    async def receive(self, text_data):

        text_data_json = json.loads(text_data)

        message = text_data_json["message"]

        # --------- ChatConsumer Room에 메시지 전송

        await self.channel_layer.group_send(

            self.room_group_name, {

                # type과 이를 처리하는 함수 이름은 동일해야 함.

                "type": "chat_message",

                "header": 'new_message',

                "message": message,

            }

        )

    # 그룹으로부터 메시지 수신

    async def chat_message(self, event):

        message = event["message"]

        # 웹소켓으로 JSON 메시지 전송

        await self.send(text_data=json.dumps({

            "header": 'new_message',

            "message": message,

        }))  

consumers.py

 
지금은 당장 사용하지 않는 모듈들이 있지만 나중에 사용되니 넘어가줍시다.
 
포스팅이 좀 길어지니, 다음에는 오늘 작성한 consumers.py의 코드를 한 줄 씩 뜯어보고, 전체적인 구조를 설명드리겠습니다.
 
긴 글 읽어주셔서 감사합니다.
 

 

 

 

 

다음 포스트

02. Django Channels를 이용한 실시간 채팅 구현 - 실제로 채팅해보기 (tistory.com)

02. Django Channels를 이용한 실시간 채팅 구현 - 채팅 시스템 구조 이해와 채팅해보기