Django
DjangoとChannelsで簡単なチャットサーバーを構築(2)
前回からの続きです。 ルームビューを作成 chat > templates > chat > room.htmlを作成します。 ルームビューを表示するためのviewを作成します。 ルームビューへのurl […]
Related Articles
Filter by Category
Back to Latest Articles
Django
DjangoとChannelsで簡単なチャットサーバーを構築(1)
こちらのチュートリアルと同じ内容です。https://channels.readthedocs.io/en/latest/tutorial/index.html 環境 Python 3.7.0Django 2.2.2ch […]
Python
Beautiful Soupでoptionタグのvalueを取得する
Beautiful Soupで以下のようなHTMLのoptionタグのvalueを取得する方法です。 optionタグのvalueの値を取得する方法 soup = soup.find_all('option')optio […]
Django
Dockerを使ってDjangoとPostgreSQL環境を構築する方法
Dockerを使ってシンプルなDjangoとPostgreSQLの開発環境を構築する方法です。GitHubリポジトリをクローンして以下のコマンドを入力します。 1. Dockerイメージを作成 2. Djangoプロジェ […]
Django
DjangoでダウンロードするCSVの文字コードを設定
以下のような、attachmentをつけて即ダウンロードが始まるシステムで、文字コードをShift-JISにする為にto_csv()の引数にencodingをShift-JISに設定しても、ダウンロードするとUTF-8で […]
Django
That port is already in use.が表示された時の対処法
Djangoでrunserverコマンドを使って開発用サーバーを起動した時にError: That port is already in use.が表示された時の対処法です。 Error: That port is al […]
Python
Pillowを使って画像を合成する
Pillowを使って画像を合成する方法です。GitHubリポジトリ 上の２つの画像を合成して、下の画像を生成します。 Pillowのインストール バージョン確認 ディレクトリ構造 画像をリサイズ base_image = […]
Python
Pillowを使って画像をリサイズする
Pillowを使って画像をリサイズする方法です。GitHubリポジトリ Pillowのインストール バージョン確認 ディレクトリ構造 画像をリサイズ files = glob.glob('./images/*')imag […]
Python
Pillowを使って画像をクロッピングする
Pillowを使って画像をクロッピングする方法です。ソースコードはGitHubにあげています。 Pillowのインストール バージョン確認 ディレクトリ構造 画像をクロッピング files = glob.glob('./ […]
Django
Djangoで開発をする際に仮想環境を構築する方法
Djangoで開発をする際にvenvを使って仮想環境を構築する方法です。pyenvがインストールされていてバージョンを切り替えできる状態を前提に進めます。 仮想環境について Pythonで開発していると開発環境では最新の […]
Python
PythonistaでiPhoneから株価をスクレイピング
Pythonistaには多くのモジュールがプリインストールされていて、スクレイピングに必要なBeautifulSoupも初めから使える様になっています。そこで、今回はiOSアプリのPythonistaを使ってiPhone […]
Django
pandasで読み込んだCSVの値がNaNだったときの対処方法
DjangoのWEBプリケーションでCSVをpandasで読み込んでforで一行ずつループ処理をしたところ、毎回決まったところで決まったエラーが出たのでPyCharmのデバッグ機能を使って原因を調べた内容です。 プログラ […]
Python
Pythonでフォルダ内のファイルを別のフォルダにコピー
Pythonであるフォルダ内のファイルを別のフォルダにコピーする方法です。 ディレクトリ構造（ファイルのコピー後） directory = (os.getcwd())現在のディレクトリを取得します。 image_path […]
Python
Pythonでディレクトリ内のファイルを取得する
globモジュールを使いディレクトリ内にあるファイルを取得する方法です。 ディレクトリ構造 まずはディレクトリ内のjpgを全て取得します。 directory = (os.getcwd())で現在のディレクトリのパスを取 […]
Django
DjangoでDateTimeFieldが今日のデータを取得する方法
Djangoのモデル上でDateTimeField型のデータが今日の日付のデータを取得する方法です。 １つ目00:00:00から23:59:59までの範囲を条件に取得します。 2つ目今日の日付が含まれるものを条件に取得し […]
Python
変換できない文字が混ざった文字列をShift-JISに変換する
テキストファイルやCSVファイルに書き出す時に文字コードをShift-JISに指定して書き出すとエラーになる場合があります。よく見るのが、－や＆nbsp;を変換した時に出るエラーで\uff0dや\xa0と表示されます。 […]
Django
Djangoでカスタムコマンドを作り実行する
DjangoでWEBアプリケーションを開発していてデータベースの集計などをバッチ処理したいときに、カスタムコマンドを作り実行する方法です。 今回はサンプルとしてmycommandアプリケーションを作成するので以下のコマン […]
Django
Djangoで日本語文字列のQuerySetを五十音順でソートする
DjangoのWEBアプリケーションでQuerySetの表示順を五十音順にしたら、開発環境では五十音順で表示されているのに本番環境では五十音順になっていないときの対処法です。(中途半端に五十音順になっていて、4、5件毎に […]
Flask
PythonistaでFlaskからHello World!
iPhoneとiPadから使えるPythonistaというアプリを使ってFlaskからHello World!する方法です。 Pythonistaはプリインストールされたモジュールが充実していて、バージョンも2.7か3. […]
Django
Djangoでモジュールを作りviews.pyからimportして呼び出す
Djangoでモジュールを作りviews.pyからimportして呼び出す方法です。 同じ処理を何度も書いたり、同じ処理を複数回呼び出したりするときは、その処理をモジュール化してviews.pyからimportして呼び出 […]
DjangoとChannelsで簡単なチャットサーバーを構築(2)
前回からの続きです。
ルームビューを作成
chat > templates > chat > room.htmlを作成します。
chat
├── __init__.py
├── templates
│ └── chat
│ ├── index.html
│ └── room.html
├── urls.py
└── views.py<!-- chat/templates/chat/room.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Chat Room</title>
</head>
<body>
<textarea id="chat-log" cols="100" rows="20"></textarea><br/>
<input id="chat-message-input" type="text" size="100"/><br/>
<input id="chat-message-submit" type="button" value="Send"/>
</body>
<script>
var roomName = {{ room_name_json }};
var chatSocket = new WebSocket(
'ws://' + window.location.host +
'/ws/chat/' + roomName + '/');
chatSocket.onmessage = function(e) {
var data = JSON.parse(e.data);
var message = data['message'];
document.querySelector('#chat-log').value += (message + '\n');
};
chatSocket.onclose = function(e) {
console.error('Chat socket closed unexpectedly');
};
document.querySelector('#chat-message-input').focus();
document.querySelector('#chat-message-input').onkeyup = function(e) {
if (e.keyCode === 13) { // enter, return
document.querySelector('#chat-message-submit').click();
}
};
document.querySelector('#chat-message-submit').onclick = function(e) {
var messageInputDom = document.querySelector('#chat-message-input');
var message = messageInputDom.value;
chatSocket.send(JSON.stringify({
'message': message
}));
messageInputDom.value = '';
};
</script>
</html>ルームビューを表示するためのviewを作成します。
# chat/views.py
from django.shortcuts import render
from django.utils.safestring import mark_safe
import json
def index(request):
return render(request, 'chat/index.html', {})
def room(request, room_name):
return render(request, 'chat/room.html', {
'room_name_json': mark_safe(json.dumps(room_name))
})ルームビューへのurlを設定します。
# chat/urls.py
from django.conf.urls import url
from . import views
urlpatterns = [
url(r'^$', views.index, name='index'),
url(r'^(?P<room_name>[^/]+)/$', views.room, name='room'),
]一旦、ここでテストサーバーを起動して動作確認をします。
$ python manage.py runserverフォームに入力された任意のルーム名でルームが作成されます。試しにフォームに”room”を入力してエンターを押して、http://127.0.0.1:8000/chat/room/へリダイレクトされれば成功です。
consumerを作成
WebSocket接続を受け入れる基本的なconsumerを作成します。このconsumerはWebSocketで受信したメッセージを受け取り、同じWebSocketに返します。
chat > consumers.pyを作成します。
chat
├── __init__.py
├── consumers.py
├── templates
│ └── chat
│ ├── index.html
│ └── room.html
├── urls.py
└── views.py# chat/consumers.py
from channels.generic.websocket import WebsocketConsumer
import json
class ChatConsumer(WebsocketConsumer):
def connect(self):
self.accept()
def disconnect(self, close_code):
pass
def receive(self, text_data):
text_data_json = json.loads(text_data)
message = text_data_json['message']
self.send(text_data=json.dumps({
'message': message
}))チャットアプリのルーティング設定を作成します。
chat / routing.pyを作成します。
chat
├── __init__.py
├── consumers.py
├── routing.py
├── templates
│ └── chat
│ ├── index.html
│ └── room.html
├── urls.py
└── views.py# chat/routing.py
from django.conf.urls import url
from . import consumers
websocket_urlpatterns = [
url(r'^ws/chat/(?P<room_name>[^/]+)/$', consumers.ChatConsumer),
]django_channels/routing.pyを以下の様に変更します。
# django_channels/routing.py
from channels.auth import AuthMiddlewareStack
from channels.routing import ProtocolTypeRouter, URLRouter
import chat.routing
application = ProtocolTypeRouter({
# (http->django views is added by default)
'websocket': AuthMiddlewareStack(
URLRouter(
chat.routing.websocket_urlpatterns
)
),
})ここでマイグレートします。
$ python manager.py migrate
株式会社ファントムへのお問い合わせ
群馬県でPythonを使ったAIやソフトウェアを開発している株式会社ファントムが運営しています。
Comments
[…] DjangoとChannelsで簡単なチャットサーバーを構築(2) […]