Navigation

Related Articles

Back to Latest Articles

DjangoとChannelsで簡単なチャットサーバーを構築(1)


press
DjangoとChannelsで簡単なチャットサーバーを構築(1)

こちらのチュートリアルと同じ内容です。
https://channels.readthedocs.io/en/latest/tutorial/index.html

環境

Python 3.7.0
Django 2.2.2
channels 2.2.0

プロジェクト作成

$ pip install django channels channels_redis
$ django-admin startproject django_channels

以下のディレクトリが作成されます。

.
├── manage.py
└──  django_channels
    ├── __init__.py
    ├── settings.py
    ├── urls.py
    └── wsgi.py

アプリ作成

python manage.py startapp chat

以下のディレクトリが作成されますが、チュートリアルでは使わないファイルを削除します。

chat
├── __init__.py
├── admin.py
├── apps.py
├── migrations
├── models.py
├── tests.py
└── views.py

不要なファイルを削除した後のディレクトリ構造

chat
├── __init__.py
└── views.py

作成したchatアプリをsetting.pyに記載します。

# django_channels/settings.py
INSTALLED_APPS = [
    'chat',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

ビューを追加

chatフォルダの中にtemplatesフォルダを作成します。作成したtemplatesフォルダの中にchatフォルダを作成し、その中にindex.htmlを作成します。

この様なディレクトリ構造になります。

chat
├── __init__.py
├── templates
│   └── chat
│       └── index.html
└── views.py
<!-- chat/templates/chat/index.html -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Chat Rooms</title>
</head>
<body>
    What chat room would you like to enter?<br/>
    <input id="room-name-input" type="text" size="100"/><br/>
    <input id="room-name-submit" type="button" value="Enter"/>

    <script>
        document.querySelector('#room-name-input').focus();
        document.querySelector('#room-name-input').onkeyup = function(e) {
            if (e.keyCode === 13) {  // enter, return
                document.querySelector('#room-name-submit').click();
            }
        };

        document.querySelector('#room-name-submit').onclick = function(e) {
            var roomName = document.querySelector('#room-name-input').value;
            window.location.pathname = '/chat/' + roomName + '/';
        };
    </script>
</body>
</html>

index.htmlを表示させるためのviewを作成します。

# chat/views.py
from django.shortcuts import render

def index(request):
    return render(request, 'chat/index.html', {})

chatフォルダにurls.pyを追加します。

chat
├── __init__.py
├── __pycache__
├── templates
│   └── chat
│       └── index.html
├── urls.py
└── views.py
# chat/urls.py
from django.conf.urls import url

from . import views

urlpatterns = [
    url(r'^$', views.index, name='index'),
]

django_channels内のurls.pyにも追記します。

# django_channels/urls.py
from django.conf.urls import include, url
from django.contrib import admin

urlpatterns = [
    url(r'^chat/', include('chat.urls')),
    url(r'^admin/', admin.site.urls),
]

以下のコマンドを打ってテストサーバーを起動させて、ページが表示されるか確認します。

$ python manage.py runserver
Django version 2.2.2, using settings 'django_channels.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.

Channelsを有効化

django_channelsフォルダ内にrouting.pyを新規作成します。

# django_channels/routing.py
from channels.routing import ProtocolTypeRouter

application = ProtocolTypeRouter({
    # (http->django views is added by default)
})

settings.pyにも追記します。

# django_channels/settings.py
INSTALLED_APPS = [
    'channels',
    'chat',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

settings.pyの最下部に以下のコードを追記します。

# django_channels/settings.py
# Channels
ASGI_APPLICATION = 'mysite.routing.application'

再度、テストサーバーを起動させます。

$ python manage.py runserver

コマンドラインに以下の様に出力されれば成功です。

Django version 2.2.2, using settings 'django_channels.settings'
Starting ASGI/Channels version 2.2.0 development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.

当ブログは群馬県でPython / Djangoを中心にウェブアプリケーションを開発している株式会社ファントムが運営しています。

株式会社ファントムへのお問い合わせ




Show Comments (1)

Comments

  • DjangoとChannelsで簡単なチャットサーバーを構築(2) – Fantom blog

    […] DjangoとChannelsで簡単なチャットサーバーを構築(1) […]

    • Article Author
    • 返信

Related Articles

Django

DjangoでSQLログを出力して確認する

DjangoでSQLログを出力して確認する方法です。SQLログをリアルタイムで出力して、どういうクエリがどのタイミングで実行されているのか確認できます。設定方法は簡単で、DEBUG = Trueになっている状態でsett […]

Posted on by press
Django

psycopg2がインストールできずエラーになる

psycopg2がインストールできずエラーになる DjangoでPostgreSQLに接続するために、以下のコマンドでpsycopg2をインストールしたところ、以下のエラーが発生した時の対処法です。 エラー 実際には…の […]

Posted on by press