Вывод данных на той же странице после отправки формы - PullRequest
Новая
       0

Вывод данных на той же странице после отправки формы

0 голосов
/ 14 ноября 2018

Итак, я создал небольшую программу-колбу, которая будет принимать файл, выполнять некоторую обработку и возвращать поток данных, используя yield.

Я использую HTML-форму для загрузки и отправки файла. Форма отправляет файл в скрипт Python и возвращает результат. Проблема в том, что вывод представлен на другой странице из-за атрибута действия формы, тогда как мне нужен вывод на той же странице. Возможно внутри тега div.

index.html 

<script>
if (!!window.EventSource) {
  var source = new EventSource('/upload');
  source.onmessage = function(e) {
    console.log(e)
    var byte = e.data;
    var res = byte.split(/\s/);
    console.log(res[0])
    $("#morse").text(res[0].slice(1,));

  }
}
</script>
<form action="/upload" method=post enctype=multipart/form-data >
    <p><input type="file" name="file" >
    <input type="submit" value="Upload" id="search_form_input">
    </form>


<div id="morse" class="info">nothing received yet</div>  // this is where is need my data

Код Python 

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

@app.route("/upload", methods=['GET', 'POST'])
def streambyte():
    if request.method == 'POST':
        f = request.files['file']
        list_of_items = unAssign(f)  # some file processing
        def events():
            for i in list_of_items:
                yield "data: %s\n\n" % (i)
            time.sleep(1)  # an artificial delay

        return Response(events(), content_type='text/event-stream')

Это поток данных на http://localhost:5000/upload, тогда как мне нужно на http://localhost:5000.

Я попытался использовать перенаправление с Response, но он не смог сказать TypeError: 'generator' object is not callable

1 Ответ

0 голосов
/ 30 июля 2019

Для этого вам может не потребоваться JavaScript ...

Поскольку вам нужен результат на странице index.html (т. Е. http://localhost:5000),, вам нужно создать два маршрута для одного и того жестраница индекса.

Первый маршрут загрузит свежую форму (атрибут метода не задан), а второй перезагрузит форму процесса (атрибут метода установлен в POST). Оба маршрута будут указывать на одну и ту же страницу индекса.

Вот как должен выглядеть ваш код: -

index.html 

<!DOCTYPE html>
<html>
<head>
    <title>Flask App - Output data on same page after form submit</title>
</head>
<body>

    <form method=post enctype=multipart/form-data >
    <p><input type="file" name="file" >
    <input type="submit" value="Upload" id="search_form_input">
    </form>


    <div id="morse" class="info">nothing received yet</div>
    <h3>{{ result }}</h3>
    <h3>{{ file_path }}</h3>


<!-- this is where is need my data -->

</body>
</html>

Python code 

from flask import Flask, render_template, request

app = Flask(__name__)


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


@app.route("/", methods=['GET', 'POST'])
def streambyte():
    # your file processing code is here...
    f = request.files['file']
    your_script_result = 'This variable holds the final data output'
    # your file processing code is here...

    return render_template('index.html', file_path = f, result = your_script_result)


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

Подробнее по этой ссылке: Отправить данные из текстового поля во Flask?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...