1.下载必须的包 https://github.com/Pithikos/python-websocket-server，解压缩并把文件夹名‘python-websocket-server-master’ 改为‘websocket’

2.websocket文件夹内只保留websocket_server文件夹和server.py

3.稍微修改server.py的源码

 from websocket_server import WebsocketServer

 # Called for every client connecting (after handshake)

 def new_client(client, server):

         print("New client connected and was given id %d" % client['id'])

         #server.send_message_to_all("a new client...")

         server.send_message(client,"请问有什么可以帮到您？")

 # Called for every client disconnecting

 def client_left(client, server):

         print("Client(%d) disconnected" % client['id'])

 # Called when a client sends a message

 def message_received(client, server, message):

         if len(message) > 200:

                 message = message[:200]+'..'

         print("Client(%d)_address%s said: %s" % (client['id'],client['address'], message))

         server.send_message(client,'用户编号'+str(client['id'])+':'+message)

 PORT=9001

 server = WebsocketServer(PORT,host="192.168.150.128")

 server.set_fn_new_client(new_client)

 server.set_fn_client_left(client_left)

 server.set_fn_message_received(message_received)

 server.run_forever()

4.编辑client.html

 <!DOCTYPE html>

 <html>

    <head>

    <meta charset="utf-8">

    <title>html5 websocket特性</title>

    <style>

       body{

          overflow: hidden;

       }

       h2{

          margin-top: 30px;

          text-align: center;

          background-color: #393D49;

          color: #fff;

          font-weight: normal;

          padding: 15px 0

       }

       #chat{

          text-align: center;

       }

       #win{

          margin-top: 20px;

          text-align: center;

       }

       #sse{

          margin-top: 10px;

          text-align: center;

       }

       #sse button{

          background-color: #009688;

          color: #fff;

          height: 40px;

          border: 0;

          border-radius: 3px 3px;

          padding-left: 10px;

          padding-right: 10px;

          cursor: pointer;

       }

    </style>

    <script src="/static/js/jquery.min.js"></script>

    </head>

    <body>

       <h2>聊天室</h2>

       <div id="chat">

           <textarea id="history" cols="80" rows="40"></textarea>

       </div>

       <div id="win">

          <textarea id="messagewin" cols="80" rows="5"></textarea>

       </div>

       <div id="sse">

          <button onclick="sendMessage()">发送对话</button>

       </div>

       <script type="text/javascript">

       var oHistory = $('#history');

       var oWin = $('#messagewin');

       if ("WebSocket" in window){

          console.log("您的浏览器支持 WebSocket!");

          var ws = new WebSocket("ws://192.168.150.128:9001");

         //var ws = new WebSocket("ws://localhost:9001");

          ws.onopen = function(){

             console.log("websocket 已连接上");

          }

          ws.onmessage = function (evt) {

             var dataReceive = evt.data;

             console.log("数据已接收..."+dataReceive);

             $('#history').val($('#history').val()+dataReceive+"\n");

          };

          ws.onclose = function()

             {

               console.log("连接已关闭...");

          };

       }else{

          // 浏览器不支持 WebSocket

          console.log("您的浏览器不支持 WebSocket!");

       }

       function sendMessage(){

          var dataSend = oWin.val().trim();

          ws.send(dataSend);

          oWin.val('');

       }

    </script>

    </body>

 </html>

界面

3.终端运行server.py，然后通过浏览器访问client.html进行连接

终端运行server.py

浏览器访问对话客户端

终端显示

4.接着尝试在客户端发送一句话

python与html5 websocket开发聊天对话窗的更多相关文章

  1. [已解决][HTML5]基于WebSocket开发聊天室应用

    WebSocket示例java的比较少,大部分是nodejs的,比较有名的是socket.io的chat, 借用下他的前端实现一套java的,后端基于https://github.com/genera ...

  2. AI人工智能-Python实现前后端人机聊天对话

    [前言] AI 在人工智能进展的如火如荼的今天,我们如果不尝试去接触新鲜事物,马上就要被世界淘汰啦~ 本文拟使用Python开发语言实现类似于WIndows平台的“小娜”,或者是IOS下的“Siri” ...

  3. Java后端WebSocket的Tomcat实现 html5 WebSocket 实时聊天

    WebSocket协议被提出,它实现了浏览器与服务器的全双工通信,扩展了浏览器与服务端的通信功能,使服务端也能主动向客户端发送数据.Tomcat7.0.47上才能运行. 需要添加Tomcat里lib目 ...

  4. WebSocket 网页聊天室

    先给大家开一个原始的websocket的连接使用范例 <?php /* * recv是从套接口接收数据,也就是拿过来,但是不知道是什么 * read是读取拿过来的数据,就是要知道recv过来的是 ...

  5. Python之路,Day18 - 开发一个WEB聊天来撩妹吧

    Python之路,Day18 - 开发一个WEB聊天来撩妹吧   本节内容: 项目实战:开发一个WEB聊天室 功能需求: 用户可以与好友一对一聊天 可以搜索.添加某人为好友 用户可以搜索和添加群 每个 ...

  6. Java和WebSocket开发网页聊天室

    小编心语:咳咳咳,今天又是聊天室,到现在为止小编已经分享了不下两个了,这一次跟之前的又不大相同,这一次是网页聊天室,具体怎么着,还请各位看官往下看~ Java和WebSocket开发网页聊天室 一.项 ...

  7. python tornado websocket 多聊天室（返回消息给部分连接者）

    python tornado 构建多个聊天室, 多个聊天室之间相互独立, 实现服务器端将消息返回给相应的部分客户端! chatHome.py // 服务器端, 渲染主页 --> 聊天室建立web ...

  8. Vue +WebSocket + WaveSurferJS 实现H5聊天对话交互

    引言 在与实现了语音合成.语义分析.机器翻译等算法的后端交互时,页面可以设计成更为人性化.亲切的方式.我们采用类似于聊天对话的实现,效果如下: 智能客服(输入文本,返回引擎处理后的文本结果) 语音合成 ...

  9. PyQt（Python+Qt）学习随笔：Qt Designer组件属性编辑界面中对话窗QDialog的modal属性

    modal属性表示窗口执行show()操作时是以模态窗口还是非模态窗口形式展示,缺省为False,设置该值与QWidget.windowModality的值设置为 Qt.ApplicationModa ...

随机推荐

  1. mysql 开发进阶篇系列 51 权限与安全(权限表user,db详细介绍 )

    一.概述 mysql 的权限系统主要用来对连接到数据库的用户进行权限验证,以此来判断此用户是否属于合法用户,以及合法用户给予的相应数据库权限.下面将介绍权限系统的工作原理,以及将要熟练掌握账号的管理和 ...

  2. pip install 安装出现问题：UnicodeEncodeError: 'ascii' codec can't encode characters in position XX的解决办法

    pip install 安装出现问题:UnicodeEncodeError: 'ascii' codec can't encode characters in position XX的解决办法 转自c ...

  3. struts2--使用<s:token></s:token>标签防止重复提交

    取个小例子:这是网页: <body> <s:actionerror/> <s:form action="LoginAction" method=&qu ...

  4. Quartz使用记录总结

    Quartz是一个任务调度框架,最近在项目中有用到,所以做个记录总结. 一.主要元素 Scheduler:调度器,控制任务的调度,将JobDetail和Trigger注册到Scheduler加以控制. ...

  5. Chapter 4 Invitations——5

    And that was the last contact I'd had with him, though he was there, a foot away from me, every day. ...

  6. leetcode — permutations-ii

    import java.util.ArrayList; import java.util.Arrays; import java.util.List; /** * Source : https://o ...

  7. MFC控件编程之复选框单选框分组框

    MFC控件编程之复选框单选框分组框 一丶分组框 分组框 英文叫做 GroubBox 添加了分组框主要就是分组.好看.不重点介绍 二丶单选框 英文: Raido Button 单选框需要注意的事项 1. ...

  8. Markdown——入门使用

    一 Markdown是什么 markdown是一种纯文本格式的标记语言.通过简单的标记语法,它可以使普通文本具有一定的格式.markdown的语法十分简单,常用的也不过十来个,是一种轻量级的标记语言, ...

  9. SpringBoot系列——花里胡哨的banner.txt

    前言 我们注意到springboot项目启动时,控制台会打印自带的banner,然后对于部分IT骚年来说,太单调太普通太一般了:所以,是时候表演真正的技术了 项目结构 我们只需要在springboot ...

  10. 杭电ACM2002--计算球体积

    计算球体积 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submi ...