Wie kann ich eine HTML-Vorlage dynamisch mit Echtzeitdaten aktualisieren, die aus einer Flask-Ansicht gestreamt werden?

Streamen von Daten in eine dynamisch aktualisierte HTML-Vorlage

Problem:

Generieren und Streamen von Daten in Echtzeit aus einem In der Flask-Ansicht möchten wir sie dynamisch in einem formatierten HTML anzeigen Vorlage.

Antwort:

Das Streamen von Daten innerhalb einer Flask-Antwort ist möglich, es ist jedoch nicht möglich, clientseitige Inhalte direkt zu aktualisieren. Um das gewünschte Ziel zu erreichen, verwenden Sie JavaScript und die folgenden Methoden:

Verwenden von XMLHttpRequest:

1. Führen Sie eine XMLHttpRequest-Anfrage aus, um gestreamte Daten vom Endpunkt abzurufen.
2. Implementieren Sie eine Abfrage Mechanismus (z. B. setInterval), um nach neuen Daten zu suchen.
3. Wann Neue Daten werden empfangen, analysiert und im HTML angezeigt (z. B. mithilfe der DOM-Manipulation).
4. Daten kontinuierlich verarbeiten, bis der Stream endet (oder eine Abschlussmeldung anzeigen).

# Server-side Flask code
@app.route("/stream")
def stream():
    def generate():
        for i in range(500):
            yield "{}\n".format(sqrt(i))
            sleep(1)

    return app.response_class(generate(), mimetype="text/plain")

# Client-side JavaScript
var timer = setInterval(function() {
    // Handle new data
    if (xhr.readyState == XMLHttpRequest.DONE) { clearInterval(timer); }
}, 1000);

Verwenden eines