一、安装模块

pip install channels

pip install channels-redis

二、代码

#websocket_v1/settings.py

INSTALLED_APPS = [

    'django.contrib.admin',

    'django.contrib.auth',

    'django.contrib.contenttypes',

    'django.contrib.sessions',

    'django.contrib.messages',

    'django.contrib.staticfiles',

    "app01.apps.App01Config",

    "channels"

]

ASGI_APPLICATION="websocket_v1.routing.application"

CHANNEL_LAYERS={

    "default":{

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

        "CONFIG":{

            "hosts":["redis://:123456@127.0.0.1:6379/0"]

        }

    }

}
#websocket_v1/urls.py

from django.contrib import admin

from django.conf.urls import include, url

from app01 import views

urlpatterns = [

    url(r'^admin/', admin.site.urls),

    url(r'^$', views.index),

    url(r'^chat/', include('app01.urls')),

]
#websocket_v1/routing.py

from channels.auth import AuthMiddlewareStack

from channels.routing import ProtocolTypeRouter,URLRouter

from app01 import routing

application=ProtocolTypeRouter({

    "websocket":AuthMiddlewareStack(

        URLRouter(

            routing.websocket_urlpatterns

        )

    ),

})
#app01/urls.py

from django.urls import re_path

from . import views

urlpatterns = [

    re_path(r'^$', views.index, name='index'),

    re_path(r'^(?P<room_name>[^/]+)/$', views.room, name='room'),

]
#app01/routing.py

from django.urls import re_path

from . import consumers

websocket_urlpatterns=[

    re_path(r'^ws/chat/(?P<room_name>[^/]+)/$',consumers.Chatting),

]
#app01/consumers.py

from channels.generic.websocket import AsyncWebsocketConsumer

import json

class Chatting(AsyncWebsocketConsumer):

    async def connect(self):

        print(self.scope)

        self.room_name = self.scope['url_route']['kwargs']['room_name']

        self.room_group_name='chat_%s' % self.room_name

        await self.channel_layer.group_add(

            self.room_group_name,

            self.channel_name

        )

        await self.accept()

    async def disconnect(self, close_code):

        await self.channel_layer.group_discard(

            self.room_group_name,

            self.channel_name

        )

    async def receive(self, text_data=None, bytes_data=None):

        text_data_json=json.loads(text_data)

        message=text_data_json["message"]

        print(message)

        await self.channel_layer.group_send(

            self.room_group_name,

            {

                "type":"chat_message",

                "message":message

            }

        )

    async def chat_message(self,event):

        message="匿名聊天:"+event["message"]

        print("返回")

        await self.send(text_data=json.dumps(

            {"message":message}

        ))
#app01/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))

    })
#index.html

<!-- 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=""/><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>
#chat.html

<!-- chat/templates/chat/room.html -->

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8"/>

    <title>Chat Room</title>

</head>

<body>

    <textarea id="chat-log" cols="" rows=""></textarea><br/>

    <input id="chat-message-input" type="text" size=""/><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>

django_websocket实现简单聊天室的更多相关文章

  1. 基于Server-Sent Event的简单聊天室　Web 2.0时代，即时通信已经成为必不可少的网站功能，那实现Web即时通信的机制有哪些呢？在这门项目课中我们将一一介绍。最后我们将会实现一个基于Server-Sent Event和Flask简单的在线聊天室。

    基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍.最后我们将会实现一个基于S ...

  2. Python Socket 简单聊天室2

    上篇文章写了一个简单的单线程的一问一答的简单聊天室.这次我们使用SocketServer模块搭建一个多线程异步的聊天室. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 ...

  3. Asp.Net SignalR - 简单聊天室实现

    简单聊天室 使用持久链接类我们就可以做一些即时通讯的应用了,我使用Group做了一个简单的聊天室,先上图技术细节下面再讲 可以加入聊天室.创建聊天室.发送消息,下面就说说我是如何通过Group做出来的 ...

  4. SpringBoot 搭建简单聊天室

    SpringBoot 搭建简单聊天室(queue 点对点) 1.引用 SpringBoot 搭建 WebSocket 链接 https://www.cnblogs.com/yi1036943655/p ...

  5. ASP.NET SingalR + MongoDB 实现简单聊天室（一）：搭建基本框架

    ASP.NET SingalR不多介绍.让我介绍不如看官网,我这里就是直接上源代码,当然代码还是写的比较简单的,考虑的也少,希望各位技友多多提意见. 先简单介绍聊天室功能: 用户加入聊天室,自动给用户 ...

  6. 利用socket.io+nodejs打造简单聊天室

    代码地址如下:http://www.demodashi.com/demo/11579.html 界面展示: 首先展示demo的结果界面,只是简单消息的发送和接收,包括发送文字和发送图片. ws说明: ...

  7. C#实例之简单聊天室（状态管理）

    前言        状态管理是在同一页或不同页的多个请求发生时,维护状态和页信息的过程.因为Web应用程序的通信协议使用了无状态的HTTP协议,所以当客户端请求页面时,ASP.NET服务器端都会重新生 ...

  8. java web利用mvc结构实现简单聊天室功能

    简单聊天室采用各种内部对象不适用数据库实现. 一个聊天室要实现的基本功能是:         1.用户登录进入聊天室, 2.用户发言 3.用户可以看见别人发言 刚才算是简单的需求分析了,现在就应该是进 ...

  9. C#基于Socket的简单聊天室实践

    序:实现一个基于Socket的简易的聊天室,实现的思路如下: 程序的结构:多个客户端+一个服务端,客户端都是向服务端发送消息,然后服务端转发给所有的客户端,这样形成一个简单的聊天室功能. 实现的细节: ...

随机推荐

  1. font-size-adjust属性定义及用法

    font-size-adjust属性定义及用法 在css中,font-size-adjust属性是使用来更好的控制字体大小,当第一个选择的字体不可用时,浏览器使用第二个指定的字体,这可能会导致改变字体 ...

  2. apue 第10章 信号signal

    每种信号都有名字,都是以SIG开头 信号机制最简单的接口是signal函数 #include <signal.h> typedef void (*sighandler_t)(int); s ...

  3. teradata在虚拟机安装客户端sql Assistant

    学习链接:https://www.w3cschool.cn/teradata/? 1.安装过程

  4. Android学习--写一个发送短信的apk，注意布局文件的处理过程！！！

    刚开始写Android程序如图发现使用了findViewById方法之后输出的话居然是null(空指针错误),也就是说这个方法没有成功.网上说这样写是在activity_main .xml去找这个ID ...

  5. css 导航菜单+下拉菜单

    一.导航菜单 1.横向导航 代码如下: <!doctype html> <html> <head> <meta charset="utf-8&quo ...

  6. javascript实现继承的六种方式

    ​ /*实现继承的六种方式*/ /*1.扩展原型对象的方法实现继承*/ function Foo1(){} //在Foo1函数上扩展一个fn1方法,由构造函数创建的对象都具有fn1这个方法 Foo1. ...

  7. Hello cnblogs！

    console.log('Hello cnblogs')!

  8. 浅析Reactor设计模式

    简介:Reactor 设计模式是一种事件驱动的设计模式,将一个或者多个客户端请求分发到不同的处理器上,来提升事件处理的效率.主要的应用场景就是java NIO当中用户处理网络请求.使用的是异步非阻塞I ...

  9. 201⑨湘潭邀请赛 Chika and Friendly Pairs(HDU6534)

    原题链接:http://acm.hdu.edu.cn/showproblem.php?pid=6534 题意: 给你一个数组,对于第i个数来说,如果存在一个位置j,使得j>i并且a[j]-k&l ...

  10. Python文章导航

    1.Python+Eclipse安装.配置: http://www.cnblogs.com/rhyswang/p/8087752.html 2.数学运算及math库: http://www.cnblo ...