flask使用websocket

1.概述

flask实现websocket有两种方式：flask_sockets，Flask-SocketIO。

flask_sockets：该方式是flask对websocket的最原始封装，功能较为单一；

Flask-SocketIO：该方式所能提供功能较多，不但实现了socket的基本通信功能，也可以结合flask相关接口，使其更加完备。

2.flask-sockets实验

2.1 环境配置

安装flask-sockets包，版本0.2.1

pip install flask-sockets

2.2 后端

2.2.1 route

路由包括两部分，其一为页面路由，其二为后台数据交换路由。

def handle_route_websocket_simple(app):

    @app.route('/ws/test_1')

    def page_ws_test_1():

        return render_template('websocket_test.html', title="websocket test")

# websocket

def handle_route_websocket(app_socket):

    @app_socket.route('/ws/test_2')

    def page_websocket_test(ws):

        now = time.strftime('%Y-%m-%d-%H-%M-%S', time.localtime(time.time()))

        while not ws.closed:

              # 回传给clicent

            message = ws.receive()  # 接收到消息

            if message is not None:

                print("client says(%s): %s" %(now, message))

                ws.send(str("回执：server已收到消息!-- %s " % now))

                ws.send(str(json.dumps(message)))  # 回传给clicent

            else:

                print(now, "no receive")

添加路由是用方法完成的，后面两句是看一下路由映射关系。

    # websocket页面

    from flask_sockets import Sockets

    app_socket = Sockets(app)

    from .routes import handle_route_websocket, handle_route_websocket_simple

    handle_route_websocket_simple(app)

    handle_route_websocket(app_socket)

    print(app_socket.url_map)

    print(app.url_map)

路由映射关系：

Map([<Rule '/ws/test_2' -> <function handle_route_websocket.<locals>.page_websocket_test at 0x0000009D88A83620>>])

Map([

<Rule '/ws/test_1' (GET, OPTIONS, HEAD) -> page_ws_test_1>,

<Rule '/hello' (GET, OPTIONS, HEAD) ->hello>,

<Rule '/static/<filename>' (GET, OPTIONS, HEAD) -> static>])

2.2.2 启动服务器

因为返回来的报文有websocket和HTTP两种，需要在WSGI中进行区分。

具体可以看下WebSocketHandler，此处略。

def run_app_websocket():

    app_websocket = WSGIServer(('0.0.0.0', 9000), flask_app, handler_class=WebSocketHandler)

    app_websocket.serve_forever()

if __name__ == '__main__':

    pass

    #run_app()

    run_app_websocket()

2.3 前端



<html>

 <head>

  <meta charset="utf-8" />

  <title>websocket 测试</title>

  <script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.js">

</script>

  <script type="text/javascript">

         function WebSocketTest()

         {

            if ("WebSocket" in window)

            {

               // alert("您的浏览器支持 WebSocket!");

               // 打开一个 web socket

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

               ws.onopen = function(){

                  // Web Socket 已连接上，使用 send() 方法发送数据

                  ws.send("请发送数据");

                  $("#r_s").append("数据发送中...<br>")

               };

               ws.onmessage = function (evt){

                  var received_msg = evt.data;

                   $("#r_s").append("server says: "+decodeURI(received_msg)+"<br>")

                   //ws.send("数据已收到。")

               };

               ws.onclose = function(){

                  // 关闭 websocket

                   ws.send("正在关闭连接...")

                   $("#r_s").append("连接已关闭...<br>")

               };

            }

            else {

                // 浏览器不支持 WebSocket

               alert("您的浏览器不支持 WebSocket!");

            }

         }

      </script>

 </head>

 <body>

  <div id="sse">

   <a href="javascript:WebSocketTest()">运行 WebSocket</a>

  </div>

  <div id="r_s">

    操作记录：

   <br />

  </div>

 </body>

</html>

3.测试结果

后端：

client says(2019-09-27-19-54-33): 请发送数据

页面：

操作记录：

数据发送中...

server says: 回执：server已收到消息!-- 2019-09-27-19-54-33

server says: 第0条消息。。。

server says: 第1条消息。。。

server says: 第2条消息。。。

server says: 第3条消息。。。

server says: 第4条消息。。。

server says: 第5条消息。。。

server says: 第6条消息。。。

server says: 第7条消息。。。

server says: 第8条消息。。。

server says: 第9条消息。。。

连接已关闭...

flask使用websocket的更多相关文章

  1. Flask 实现 WebSocket 通讯---群聊和私聊

    一.WebSocket介绍 WebSocket是一种在单个TCP连接实现了服务端和客户端进行双向文本或二进制数据通信的一种通信的协议. WebSocket使得客户端和服务器之间的数据交换变得更加简单, ...

  2. Flask基于websocket的简单聊天室

    1.安装gevent-websocket pip install -i https://pypi.tuna.tsinghua.edu.cn/simple/ gevent-websocket 2.cha ...

  3. Flask实现websocket

    from flask import Flask,request user_socket_dict = {} app = Flask(__name__) @app.route("/conn_w ...

  4. flask POOL,websocket握手

    一.POOL Pool就是为了多线程访问数据库,减少数据库压力 回顾pymysql import pymysql #建立连接 mysql_conn = pymysql.connect(host=&qu ...

  5. Flask 之 WebSocket

    http:是一个协议 规定:数据传输格式 -/r/n/r/n 一次的请求,一次的响应,断开了 短链接 无状态 服务器收到的请求,做出的响应给客户端 客户端主动向服务器发起请求 基于socket sen ...

  6. 【Flask】 flask-socketio实现WebSocket

    [flask-socektio] 之前不知道在哪个场合下提到过如何从web后台向前台推送消息.听闻了反向ajax技术这种模式之后,大呼神奇,试了一下之后发现也确实可以用.不过,反向ajax的代价也很明 ...

  7. 简单使用WebSocket实现聊天室

    环境需求:flask,websocket第三方包 目录结构 web中实现群聊 ws_群聊.py文件 # 实现一个websocket 先下载包 gevent-websocket from flask i ...

  8. 轮询、长轮询和websocket

    一.轮询 在一些需要进行实时查询的场景下应用比如投票系统: 大家一起在一个页面上投票 在不刷新页面的情况下,实时查看投票结果 1.后端代码 from flask import Flask, rende ...

  9. Python websocket

    一.自己实现websocket 网上流传的都是Python2的websocket实现 # coding=utf8 # !/usr/bin/python import struct, socket im ...

随机推荐

  1. 关于强类型、ViewData

    对于ASP.NET MVC中页面强类型的个人理解   进入ASP.NET MVC学习 发现很多和winfrom不同的东西,但是利用的C#语言还是没有变化,更多的是利用了新的语言,html jquery ...

  2. 第一篇 网站基础知识 第5章 自己动手实现HTTP协议

    第5章 自己动手实现HTTP协议 我们知道HTTP协议是在应用层解析内容的,只需要按照它的报文的格式封装和解析数据就可以了,具体的传输还是使用的Socket,在第4章NioServer的基础上自己做一 ...

  3. PP: Composite visual mapping for time series visualization

    However: The conventional visual mapping maps each data attribute onto a single visual channel Purpo ...

  4. session的到底是做什么的？

    原文地址:https://blog.csdn.net/h19910518/article/details/79348051 前言: 今天就来彻底的学一些session是个啥东西,我罗列了几个需要知道的 ...

  5. 爬虫实战 豆瓣音乐top250 xpath

    刷知乎时刷到一篇爬取豆瓣音乐top250的,然后看了看,感觉自己的爬虫又更上一层楼了哈啊哈哈,尤其是发现xpath这么好用的东西. 不过也有一个感慨,就是有很多种方式都可以获得想要的数据,对于入门的新 ...

  6. DE1-GHRD

    新建工程socs_system 进入菜单选择Tools---Qsys 配置hps系统 首先选择 在更改参数 配置hps的sdram各项参数 将名字改为hps_0 这样hps配置完成:在配置存储器和其他 ...

  7. lua 随机数 math.random()和math.randomseed()用法

    用法一:  不给范围,就随机算一个0~1之间的小数: 用法二:给一个参数,就取1~n之间的随机数 用法三:给两个参数,就取m~n之间的随机数 math.randomseed()用法:     由于C中 ...

  8. 通过JMX获取JVM信息

    package com.googosoft.gateway_zuul; import java.lang.management.ClassLoadingMXBean; import java.lang ...

  9. Windows下PHP安装 Imagick 扩展

    1.下载拓展下载地址一: http://windows.php.net/downloads/pecl/releases/imagick/下载地址二: https://pecl.php.net/pack ...

  10. Linux - 文件时间戳

    概述 简介 linux 文件时间戳 背景 最近感觉很消极的样子 心情不好加不知道写啥 随便水一水 能水的就那么多, 水一次, 少一次 环境 os centos7 1. 时间戳 概述 简述 时间戳 li ...