在flask上使用websocket


 

Flask-SocketsFlask-SocketIO之間的主要區別在於前者僅僅將WebSocket協議(通過使用gevent-websocket項目)進行包裝,因此它只適用於原生支持WebSocket協議的瀏覽器,對於那些不支持WebSocket協議的較老的瀏覽器,就無法使用它了Flask-SocketIO則不同,通過前面的介紹,讀者應該已經知道了它不僅實現了WebSocket協議,並且對於那些不支持WebSocket協議的舊版瀏覽器,使用它也能夠實現相同的效果。新版舊版的瀏覽器都能使用他 
另一個區別是Flask-SocketIO實現了SocketIO Javascript庫公開的消息傳遞協議。 Flask-Sockets只是實現通信通道,發送的是完全取決於應用程序。 
Flask-SocketIO還為事件處理程序創建了一個類似flask的常規視圖函數的環境,包括創建應用程序和請求上下文。 然而,在文檔中會介紹一些重要的例外情形。

Flask-SocketIO服務器端程序

如下是一個使用了Flask-SocketIO的Flask應用程序。

from flask import Flask, render_template
from flask_socketio import SocketIO, emit

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app)

@app.route('/')
def index():
    return render_template('index.html')

@socketio.on('my event', namespace='/test')
def test_message(message):
    emit('my response', {'data': message['data']})

@socketio.on('my broadcast event', namespace='/test')
def test_message(message):
    emit('my response', {'data': message['data']}, broadcast=True)

@socketio.on('connect', namespace='/test')
def test_connect():
    emit('my response', {'data': 'Connected'})

@socketio.on('disconnect', namespace='/test')
def test_disconnect():
    print('Client disconnected')

if __name__ == '__main__':
    socketio.run(app)

SocketIO客戶端程序

$(document).ready(function(){
    var socket = io.connect('http://' + document.domain + ':' + location.port + '/test');
    socket.on('my response', function(msg) {
        $('#log').append('<p>Received: ' + msg.data + '</p>');
    });
    $('form#emit').submit(function(event) {
        socket.emit('my event', {data: $('#emit_data').val()});
        return false;
    });
    $('form#broadcast').submit(function(event) {
        socket.emit('my broadcast event', {data: $('#broadcast_data').val()});
        return false;
    });
});

使用Flask-Sockets

sever端:

from flask import Flask
from flask_sockets import Sockets
import datetime
import time
import random


app = Flask(__name__)
sockets = Sockets(app)


@sockets.route('/echo')
def echo_socket(ws):
    while not ws.closed:

        now = datetime.datetime.now().isoformat() + 'Z'
        ws.send(now)  #發送數據
        time.sleep(1)



@app.route('/')
def hello():
    return 'Hello World!'


if __name__ == "__main__":
    from gevent import pywsgi
    from geventwebsocket.handler import WebSocketHandler
    server = pywsgi.WSGIServer(('', 5000), app, handler_class=WebSocketHandler)
    print('server start')
    server.serve_forever()

client端:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.js"></script>
</head>
<body>
    <div id="time" style="width: 300px;height: 50px;background-color: #0C0C0C;
    color: white;text-align: center;line-height: 50px;margin-left: 40%;font-size: 20px"></div>

    <script>
            var ws = new WebSocket("ws://127.0.0.1:5000/echo");  #連接server

            ws.onmessage = function (event) {
                content = document.createTextNode(event.data); # 接收數據
                $("#time").html(content);

            };

    </script>
    </body>
</html>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM