text/event-stream rozpoznawany jako download

Próbuję zaimplementować server push w moim projekcie Flask po ten tutorial .

Skonfigurowałem to wszystko bez błędów, jednak gdy wchodzę na stronę /stream, Firefox rozpoznaje to jako plik i próbuje go pobrać. W Safari po prostu drukuje wysłane dane. Próbowałem dostosować kod do prostszej implementacji, gdzie wątek po prostu daje pewne dane w każdej sekundzie, jednak przyniosło to takie same wyniki.

Moim celem jest za każdym razem, gdy skrypt w Pythonie osiąga punkt w pętli zaktualizuje pasek postępu w interfejsie internetowym.

Każda pomoc z tym byłaby świetna. Dzięki.

Edit:

App.py

from flask import Flask, render_template, request, Response

app = Flask(__name__)

def event_stream():
    event = "Hello!"
    yield 'data: %s\n\n' % event

@app.route('/stream')
def stream():
    return Response(event_stream(), mimetype="text/event-stream")

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

Indeks.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    <script type="text/javascript">
        var source = new EventSource('/stream');
        source.onmessage = function (event) {
             alert(event.data);
        };
    </script>

</head>
<body>

    <p>Stream page</p>

</body>
</html>
Author: DJDMorrison, 2014-10-22

1 answers

EDIT

Załadowałem moją przykładową aplikację na Github. Sprawdź to tutaj: https://github.com/djdmorrison/flask-progress-example


Rozpracowałem to, ale dla każdego, kto ma ten sam problem:

Indeks.strona html nigdy się nie ładuje, ponieważ nigdy nie jest wywoływana app.py. sposobem na to jest przejście do oddzielnej trasy, na przykład / page, a następnie zwrócenie send_file('index/html'). Spowoduje to załadowanie strony indeksu, utworzenie źródła zdarzeń powiązanego z / stream, który następnie uruchomi metodę stream w app.py i podać poprawne dane.

Przykład, który tworzy pasek postępu zwiększając x Co 0,2 sekundy i wyświetlając go na stronie:

App.py

@app.route('/page')
def get_page():
    return send_file('templates/progress.html')

@app.route('/progress')
def progress():
    def generate():
        x = 0
        while x < 100:
            print x
            x = x + 10
            time.sleep(0.2)
            yield "data:" + str(x) + "\n\n"
    return Response(generate(), mimetype= 'text/event-stream')

Postęp.html

<!DOCTYPE html>
<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <script>

    var source = new EventSource("/progress");
    source.onmessage = function(event) {
        $('.progress-bar').css('width', event.data+'%').attr('aria-valuenow', event.data);   
    }
    </script>
</head>
<body>
    <div class="progress" style="width: 50%; margin: 50px;">
        <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%"></div>
    </div>
</body>
</html>
 24
Author: DJDMorrison,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-02-28 10:57:13