# settings.py:

INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'channels',
] ASGI_APPLICATION = "webSokect.routing.application"
# routing.py

#!/usr/bin/env python
# -*- coding:utf-8 -*-
from channels.routing import ProtocolTypeRouter, URLRouter
from django.conf.urls import url
from api import consumers application = ProtocolTypeRouter({
'websocket': URLRouter([
url(r'^chat/$', consumers.ChatConsumer),
])
})
# consumers.py

#!/usr/bin/env python
# -*- coding:utf-8 -*-
from channels.generic.websocket import WebsocketConsumer
from channels.exceptions import StopConsumer CLIENTS = [] class ChatConsumer(WebsocketConsumer): def websocket_connect(self, message):
self.accept()
CLIENTS.append(self) def websocket_receive(self, text_data=None, bytes_data=None):
# print("message",text_data)
for item in CLIENTS:
item.send(text_data['text']) # self.send(text_data['text']) def websocket_disconnect(self, message):
print('客户端断开连接了')
CLIENTS.remove(self)
raise StopConsumer()
# chat.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Talking</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<style>
#taking {
width: 100%;
height: 700px;
background: #42fbff;
}
</style>
</head>
<body>
<div id="app" class="container">
<div class="card-header">在线聊天室</div>
<div id="taking">
<ul id="uls"> </ul>
</div>
<div style="width: 100%;height: 80px">
<textarea type="text" id="txt" placeholder="请输入内容" style="width: 100%;height: 100%"></textarea>
</div>
<button class="btn btn-primary" style="width: 100px" id="sendMsg">发送</button>
<button class="btn btn-danger" style="width: 100px" id="close">断开连接</button>
</div>
</body>
</html>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
var ws = new WebSocket("ws://127.0.0.1:8001/chat/") // 检测是否连接成功
ws.onopden = function(event){
console.log("成功连接");
}; // 接受消息
ws.onmessage = function(event){
{#console.log("消息",event.data);#}
var tag = $("<li>" + event.data + "</li>")
{#console.log(tag)#}
{#tag.text(event.data)#}
$("#uls").append(tag)
} // 发送
$("#sendMsg").click(function () {
ws.send($("#txt").val())
}) // 关闭
$("#close").click(function () {
ws.close()
console.log("断开成功");
}) </script>

【webSokect】基于django Channels的简单实现的更多相关文章

  1. 基于django的自定义简单session功能

    基于django的自定义简单session功能 简单思路: 1.建立自定义session数据库 2.登入时将用户名和密码存入session库 3.将自定义的随机session_id写入cookie中 ...

  2. 通过Django Channels设计聊天机器人WEB框架

    这两个月都在忙着设计针对银联客服业务的智能聊天机器人,上一周已经交完设计报告,这一周还和部门同事一起分享了系统设计及运行效果.因为时间的关系,系统原型我使用了Flask+jQuery的组合,感觉用以原 ...

  3. web 框架的本质及自定义web框架 模板渲染jinja2 mvc 和 mtv框架 Django框架的下载安装 基于Django实现的一个简单示例

    Django基础一之web框架的本质 本节目录 一 web框架的本质及自定义web框架 二 模板渲染JinJa2 三 MVC和MTV框架 四 Django的下载安装 五 基于Django实现的一个简单 ...

  4. 基于Django进行简单的微信开发

    代码地址如下:http://www.demodashi.com/demo/11756.html 一.微信公众号的准备: 1. 注册 访问地址:https://mp.weixin.qq.com/ 按照提 ...

  5. 实时 Django 终于来了 —— Django Channels 入门指南

    Reference: http://www.oschina.net/translate/in_deep_with_django_channels_the_future_of_real_time_app ...

  6. Django Channels 入门指南

    http://www.oschina.NET/translate/in_deep_with_django_channels_the_future_of_real_time_apps_in_django ...

  7. 【翻译】Django Channels 官方文档 -- Tutorial

    Django Channels 官方文档 https://channels.readthedocs.io/en/latest/index.html 前言: 最近课程设计需要用到 WebSocket,而 ...

  8. 【Django】基于Django架构网站代码的目录结构

     经典的Django项目源码目录结构 Django在一个项目的目录结构划分方面缺乏必要的规范.在Django的官方文档中并没有给出大型项目的代码建议目录结构,网上的文章也是根据项目的不同结构也有适当的 ...

  9. 基于django的视频点播网站开发

    项目名称 基于django的视频点播网站开发 项目背景 学习完毕python和django之后,想找个项目练练手,本来想写个博客项目练手,无奈别人已经写过了,所以笔者就打算写一个视频点播网站,因为笔者 ...

随机推荐

  1. 我是先学C语言还是先学C++,实不相瞒,鱼和熊掌可兼得!

    这是最近一周时间几个读者小伙伴所提的问题,我顺手截了两个图. 实不相瞒,这类问题之前也经常看到.     每次遇到这种问题,看起来很简单,但是打字一时半会还真说不清,想想今天周末了,写一篇文章来统一聊 ...

  2. 【传递闭包】HDU 2157 How many ways??

    UPD:现在才发现本题是个传递闭包 题目内容 春天到了,HDU校园里开满了花,姹紫嫣红,非常美丽. 葱头是个爱花的人,看着校花校草竞相开放,漫步校园,心情也变得舒畅. 为了多看看这迷人的校园,葱头决定 ...

  3. P2340 [USACO03FALL]Cow Exhibition G题解

    新的奇巧淫技 原题传送门 众所周知,模拟退火是一种很强大的算法,DP很强,但我模拟退火也不虚,很多题你如果不会的话基本可以拿来水很多分.比如这道题,我用模拟退火可以轻松水过(虽然我是足足交了两页才过) ...

  4. go读取键盘输入两种方式

    一种scanf var x intfmt.Println("input a int number")fmt.Scan(&x)fmt.Printf("读取到内容:% ...

  5. JavaScript实现异步的4中方法

    一:背景简介 Javascript语言的执行环境是"单线程"(single thread). 所谓"单线程",就是指一次只能完成一件任务.如果有多个任务,就必须 ...

  6. Vue踩坑日记-You may use special comments to disable some warnings. Use // eslint-disable-next-line to ignore the next line. Use /* eslint-disable */ to ignore all warnings in a file.

    记录时间:2019年4月24日16:55:54 在build/webpack.base.conf.js文件中,注释或者删除掉:module->rules中有关eslint的规则

  7. open_spiel 随笔

    ------------恢复内容开始------------ ------------恢复内容开始------------ 遇到的一些疑惑且已经解决的 1. SPIEL_CHECK_GT()诸如此类的 ...

  8. day03基本数据类型

    运算符补充 ​ 今天补充一些简单知识: #!/usr/bin/env python # -*- coding:utf-8 -*- value = "我是中国人" # 判断'中国'是 ...

  9. 如何分析、排查、解决Redis变慢问题?

    关于如何分析.排查.解决Redis变慢问题,根据实践总结了一些清单如下: 1.使用复杂度过高的命令(例如SORT/SUION/ZUNIONSTORE/KEYS),或一次查询全量数据(例如LRANGE ...

  10. 【4】TensorFlow光速入门-保存模型及加载模型并使用

    本文地址:https://www.cnblogs.com/tujia/p/13862360.html 系列文章: [0]TensorFlow光速入门-序 [1]TensorFlow光速入门-tenso ...