使用Flask在客户端之间传递变量

Question

I'm trying to get some code to work but can't seem to get it right, The intention is that all the clients can see when a button is pushed.

At the moment I can get the client that presses the button to see the message but no other.

Py:

pushedDict = {}    

@app.route('/buttons/')
def index():
    return flask.render_template('index.html', port=port)

def wsgi_app(environ, start_response):  
    path = environ["PATH_INFO"]  
    if path == "/buttons/":  
        return app(environ, start_response)
    elif path == "/websocket/":  
        handle_websocket(environ["wsgi.websocket"])
    else:  
        return app(environ, start_response)  


def handle_websocket(ws):
    while True:
        pushRecieve = ws.receive()    # Receive pushed Buttons 
        gap = "Button"    # Placeholder for later
        pushedDict.update({gap:pushRecieve})    # Add to Dictionary
        pushSend = json.loads(pushedDict[gap])    # Get from Dictionary
        ws.send(json.dumps({'output': pushSend['output']}))    # Send 
        pushedDict.update({gap:""})    # Clear Dictionary

JS Receive:

$(document).ready(function(){                                            

    $(function() {
        if ("WebSocket" in window) {
            ws = new WebSocket("ws://" + document.domain + ":{{port}}/websocket/");
            ws.onmessage = function (msg) {
                var getButtons = JSON.parse(msg.data);
                $("p#log").html(getButtons.output );
            };
        };
    });

JS Send:

    var buttonQueue = [];

    $("a.button1").mousedown(function(e){
        e.preventDefault();
        buttonQueue.push("button1")
        ws.send(JSON.stringify({'output': buttonQueue}));
    });
    $("a.button1").mouseup(function(e){
        e.preventDefault();
        remove(buttonQueue, "button1");
        ws.send(JSON.stringify({'output': buttonQueue}));
    });
    $("a.button2").mousedown(function(e){
        e.preventDefault();
        buttonQueue.push("button2")
        ws.send(JSON.stringify({'output': buttonQueue}));
    });
    $("a.button2").mouseup(function(e){
        e.preventDefault();
        remove(buttonQueue, "button2");
        ws.send(JSON.stringify({'output': buttonQueue}));
    });


});

Appreciate a fresh point of view.

Answer 1

I'm no expert on WebSockets, but my impression is that the ws protocol only establishes an ongoing connection between client and server, allowing data to be sent from the server without constant requests from the client. Your Flask app doesn't know about any other clients connected; it only uses handle_websocket(ws) to talk to one client at a time. You have to tell your Flask app which clients are currently connected, then ws.send() the button press updates to all of them. I don't have any experience with this, but it looks like the most popular way to track ws-connected clients and send them updates is redis . I also found an example chat application that you could adapt for your needs. Hope this helps!