Update JavaScript with Python variable

[vtyr]

Hi there,

I'd like to push an updating variable from my app.py. I have a form on a page which accepts a list, and then with that list my Python queries it line by line, and updates a variable called "counter" with which line it's on. I'd like to send this variable to JavaScript in order for it to return information to the page (primarily a progress bar) on how the application is doing.

Is there a simple way to do this with flask-socketio? Here's a simple idea of the code:

app.py
@socketio.route("/check", methods=['GET', 'POST'])
def checker():
    pagename = 'Checker'
    limit = len(df.index))
    counter = 0
    
    while counter < limit:
         counter += 1

    return render_template('checker.html', pagename=pagename, counter=counter

Then I have JS for the progress bar:

 $(function() {;
    var interval = setInterval(function() {
        var {{counter}};
        $("#dynamic")
        .css("width", {{counter}} + "%")
        .attr("aria-valuenow", {{counter}})
        .text({{counter}} + "% Complete");
        if ({{counter}} >= 100)
            clearInterval(interval);
        console.log({{counter}});
    }, 1000);
  });

Finally on my check.html I have the progressbar:

<div class="progress">
        <div id="dynamic" class="progress-bar progress-bar-success progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
          <span id="current-progress"></span>
        </div>
      </div>

Many thanks

[miguelgrinberg]

Socket.IO doesn't really work in the way you describe. What you can do is have the server notify the client when the counter has changed. The notification can include the new value of the counter. On the Python side this would be something like this:

socketio.emit('new_counter', counter)

Then the client can define a handler for the new_counter event:

socketio.on('new_counter', (counter) => {
  // do something with counter here
});

[miguelgrinberg]

There is nothing in these logs about Socket.IO. Did you follow the troubleshooting instructions I pointed you at?

[vtyr]

There is nothing in these logs about Socket.IO. Did you follow the troubleshooting instructions I pointed you at?

As far as I'm aware I have?

app = Flask(__name__)
app.config['SECRET_KEY'] = 'mysecret'
socketio = SocketIO(app)
socketio = SocketIO(logger=True, engineio_logger=True)

[miguelgrinberg]

You have two SocketIO objects. You should have only one.

[vtyr]

You have two SocketIO objects. You should have only one.

I'm assuming socketio = SocketIO(app, cors_allowed_origins="*", logger=True, engineio_logger=True) should do the trick, although there's nothing additional to the logs previously provided

[miguelgrinberg]

You seem to have your own logging configuration, since the output of your logs is not the default. Something in your configuration must be prevented the logs from Socket.IO from being printed. I suggest you try the example in this repository with logging, to see what are the logs that you should expect to see, then debug your logging configuration until the Socket.IO logs pass through.