flask应用程序和socketIO，用于在客户端之间同步浏览器

Question

I am trying to make sure that the browsers of my website are synced up. Specifically a textarea in my flask app using sockets. I would like to be able to make sure that people are viewing the same content at about the same time. It doesn't have to be immediate. If someone has a better solution than updating the socket each time a key is pressed?

My real question is why doesn't the socket print a message on the back end when the emitter is triggered?

Here is the relevant code:

from werkzeug import secure_filename
from flask import Flask, render_template, jsonify, make_response, request
import json
import string
import sys
from io import StringIO  # Python3sdf
import OSC
import time
from flask_sqlalchemy import SQLAlchemy
from sqlalchemy.ext import mutable

import os
from flask_socketio import SocketIO, emit


project_dir = os.path.dirname(os.path.abspath(__file__))
database_file = "sqlite:///{}".format(os.path.join(project_dir, "music.db"))

app = Flask(__name__)
socketio = SocketIO(app)
app.config["SQLALCHEMY_DATABASE_URI"] = database_file





@socketio.on('value changed')
def value_changed(message):
    print(message)


@app.route('/')


def my_form():
    song_query = SongClass.query.all()
    if song_query[-1]:
        song = str(song_query[-1])
    else:
    song = " "
    if song_query[-2]:
        song2 = str(song_query[-2])
    else:
    song2 = " "
    return render_template('index.html', song=song, song2=song2)





if __name__ == "__main__":
socketio.run(app, host='0.0.0.0', port = 5002)

here is the relevant code in index.html:

<!DOCTYPE html>
<html>
    <head>

        <title>CodeMirror</title>

                <script type="text/javascript" src="js/jquery.min.js"></script>
                <script type="text/javascript" src="plugin/codemirror/lib/codemirror.js"></script>
                <script type="text/javascript" src="js/default.js"></script>
                <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
                <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/0.9.16/socket.io.min.js"></script>
<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        var socket = io.connect();
        // the socket.io documentation recommends sending an explicit package upon connection
        socket.on('connect', function() {
            socket.emit('connect', {data: 'I\'m connected!'});
        });
        $('#song').on('change keyup paste', function(event) {
            alert("blah");
        socket.emit('value changed',{data: $('#song').val()});
            return false;

     });
});

<div style="float:left;">
    <textarea rows="40" cols="100" name="song" id="song">{{song}}</textarea>


</html>

I am getting the alert from jquery but nothing happens on the back end. IE I dont see a message printed.

Answer 1

You are using an ancient version of the Socket.IO JavaScript client. Use a 2.x version and I think you will be fine.