забавные часы потокового текста с питоном и колбой

Question

Пожалуйста, помогите. Какой код потребуется, чтобы создать простое приложение с текстовыми часами с python и flask, чтобы продемонстрировать, как работает flask streaming ? В идеале приложение должно показывать время текста, перезаписывая на экране, из потока обновлений раз в секунду.

Поток часов - это упрощенный случай текстового потока в реальном времени. Реальная основная потребность заключается в том, чтобы сервер выдавал одновременные видео и текстовые потоки (без звука), такие как Потоковое видео Мигеля Гринберга с Flask , и отображал оба обновления на экране на стороне клиента. Демо-видео Мигеля работает. Однако я пока не знаю, как заставить работать одновременный текстовый поток.

Я попробовал приведенный ниже код, и есть некоторые причуды:

1. Элемент html p является просто заполнителем для текста. Его можно изменить на все, что может работать лучше.
2. http://localhost:5000 показывает '/ time_feed', когда я хочу, чтобы вместо этого показывалось содержимое строки времени /time_feed.

3. http://localhost:5000/time_feed вообще ничего не показывает во время работы колб-сервера. Когда флеш-сервер внезапно останавливается, в браузере появляется куча обновлений, например:

   2018.11.01 | 20: 29: 272018.11.01 | 20: 29: 282018.11.01 | 20: 29: 292018.11.01 | 20: 29: 302018.11.01 | 20: 29: 312018.11.01 | 20: 29 : 322018.11.01 | 20: 29: 33

Я пытался Потоковая передача данных с помощью Python и Flask , но не понимаю, как применить ответы javascript или jinga к коду моих часов. Я новичок в разработке веб и фляг.

app.py:

#!python3 Flask 
# streaming clock per http://flask.pocoo.org/docs/1.0/patterns/streaming

from flask import Flask, Response, render_template, url_for
from datetime import datetime
import time

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/time_feed')
def time_feed():
    def generate():
        while True:
            yield datetime.now().strftime("%Y.%m.%d|%H:%M:%S")
            time.sleep(1)
    return Response(generate(), mimetype='text')

if __name__ == '__main__':
    app.run(debug=True, threaded=True)

.

/ шаблоны / index.html:

<title>Clock</title>
<h1>Clock</h1>
<p>{{ url_for('time_feed') }}</p>

Answer 1

ввиду, что вы можете избежать while и sleep в этом примере:

@app.route('/time_feed')
def time_feed():
    def generate():
        yield datetime.now().strftime("%Y.%m.%d|%H:%M:%S")  # return also will work
    return Response(generate(), mimetype='text') 

в шаблоне:

<p id="clock">Here will be date|time</p>

<script>
    var clock = document.getElementById("clock");

    setInterval(() => {
        fetch("{{ url_for('time_feed') }}")
        .then(response => {
                response.text().then(t => {clock.innerHTML = t})
            });
        }, 1000);  
</script>

в вашем примере с video streem это просто обман, это не решение для реального потокового видео, просто потому, что не обеспечивает аудио. Если вам нужен реальный видеопоток, вам нужно использовать webRTC с Kurento-медиа-сервером, например. Для python посмотрите на aiortc lib.

Answer 2

Вы совершенно не понимаете, как это работает. streaming не означает, что он может передавать данные с перерывами, но означает, что он может передавать огромные данные, при этом не нужно загружать их все в начале.

Таким образом, при использовании потока вы все еще используете только один запрос. Этот запрос является целым, ваш браузер может обработать ответ только после того, как все данные будут переданы. В вашем случае, когда вы используете бесконечный цикл, ваш браузер будет просто ждать данные вечно.

Для достижения того, что вы хотите, у вас есть два варианта:

1. Используйте js для продолжения отправки запроса в секунду.
2. Использовать веб-сокет.

обновление

Оказывается, что некоторые элементы могут работать со специальным mimetype multipart/x-mixed-replace, чтобы добиться длительного опроса. Так как я не являюсь фронтменом, возможно, кто-то может предоставить или исправить мой ответ.