Bagaimanakah saya boleh mengemas kini templat HTML secara dinamik dengan data masa nyata yang distrim daripada paparan Flask?

Strim Data ke dalam Templat HTML Dikemas Kini Secara Dinamik

Masalah:

Menjana dan menstrim data dalam masa nyata daripada Paparan kelalang, kami mahu memaparkannya secara dinamik dalam HTML berformat templat.

Jawapan:

Penstriman data dalam respons Flask adalah mungkin, walau bagaimanapun, anda tidak boleh mengemas kini kandungan sebelah pelanggan secara langsung. Untuk mencapai yang diingini, gunakan JavaScript dan kaedah berikut:

Menggunakan XMLHttpRequest:

1. Lakukan permintaan XMLHttpRequest untuk mengambil data yang distrim dari titik akhir.
2. Laksanakan tinjauan pendapat mekanisme (cth., setInterval) untuk menyemak yang baharu data.
3. Apabila data baharu diterima, huraikan dan paparkannya dalam HTML (cth., menggunakan manipulasi DOM).
4. Kendalikan data secara berterusan sehingga strim tamat (atau paparkan mesej penyiapan).

# 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);

Menggunakan an