我有一个DNA扫描工具.我想要异步发送和接收数据.在Flask中的每个操作之后,我希望将数据发送到前端,该前端将告诉用户正在发生的事情.

以下是我的代码: Flask :

 @app.route('/upload', methods = ['GET','POST'])
    def upload():
        if request.method == "POST":
            uploaded_file = request.files['fasta_file']
            uploaded_file.filename = str(uuid.uuid4()) + ".fasta"
            file_name = uploaded_file.filename
            if file_name != '':
                file_ext = os.path.splitext(file_name)[1]
                if file_ext not in app.config['UPLOAD_EXTENSIONS']:
                    return redirect(url_for('uploader'))
                else:
                    print("Uploading")
                    uploaded_file.save(os.path.join(app.config['UPLOAD_PATH'], file_name))
                    print("Uploaded")
                    print("Scanning")
                    os.system(f"python3 DNAScanner.py instance/uploads/{file_name}%2%3")
                    print("Scanned")
                    new_folder = pickle.load(open("store.p","rb"))
                    print("Making ZIP FILE")
                    shutil.make_archive(f"static/output/{new_folder}", 'zip', f"static/output/{new_folder}")
                    print("Done")

JS:

$('#submit').click(function() {
    var form_data = new FormData($('form')[0]);
    $.ajax({
        type: 'POST',
        url: '/upload',
        data: form_data,
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            console.log(data);
        },
    });
});

            

因此,无论我使用打印功能在Flask 中打印什么,我都想在前端向用户显示它.

推荐答案

我建议使用FlaskSocketIO并将打印语句通过管道传输到套接字中.

pip install flask-socketio

from flask_socketio import SocketIO, emit
from flask import Flask, request, render_template
from uuid import uuid4
import os

@app.route('/upload', methods = ['GET','POST'])
def upload():
    if request.method == "POST":
        uploaded_file = request.files['fasta_file']
        uploaded_file.filename = str(uuid.uuid4()) + ".fasta"
        file_name = uploaded_file.filename
        if file_name != '':
            file_ext = os.path.splitext(file_name)[1]
            if file_ext not in app.config['UPLOAD_EXTENSIONS']:
                return redirect(url_for('uploader'))
            else:
                socketio.emit('uploadstatus',{"uploadlogger": "Uploading"})
                uploaded_file.save(os.path.join(app.config['UPLOAD_PATH'], file_name))
                socketio.emit('uploadstatus',{"uploadlogger": "Uploaded"})
                socketio.emit('uploadstatus',{"uploadlogger": "Scanning"})
                os.system(f"python3 DNAScanner.py instance/uploads/{file_name}%2%3")
                socketio.emit('uploadstatus',{"uploadlogger": "Scanned"})
                new_folder = pickle.load(open("store.p","rb"))
                socketio.emit('uploadstatus',{"uploadlogger": "Making ZIP FILE"})
                shutil.make_archive(f"static/output/{new_folder}", 'zip', f"static/output/{new_folder}")
                socketio.emit('uploadstatus',{"uploadlogger": "Done"})

在您的前端html中放入:

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js" integrity="sha512-q/dWJ3kcmjBLU4Qc47E4A9kTB4m3wuTY7vkFJDTZKjTs8jhyGQnaUrxa0Ytd0ssMZhbNua9hE+E7Qv1j+DyZwA==" crossorigin="anonymous"></script>

在您的前端js中放入:

var socket = io();
socket.on('uploadstatus', function(msg) {
        console.log(msg.uploadlogger)
        }
    )

关于我的信息来源的链接-https://flask-socketio.readthedocs.io/en/latest/getting_started.html

小贴士:在为flASK安装Socketio时,请确保您的flaskSocketio和您添加到您的html中的客户端版本是相同的.-https://stackoverflow.com/a/52883703/18192997

Javascript相关问答推荐

如何在表格上拥有水平滚动条,在正文页面上拥有垂直滚动条,同时还对html表格的标题使用位置粘性?

node TS:JWT令牌签名以验证客户端和后台问题之间的身份验证

如何在mongoose中链接两个模型?

在拖放时阻止文件打开

并不是所有的iframe都被更换

如何在不影响隐式类型的情况下将类型分配给对象?

从逗号和破折号分隔的给定字符串中查找所有有效的星期几

处理TypeScrip Vue组件未初始化的react 对象

react -原生向量-图标笔划宽度

判断函数参数的类型

Reaction即使在重新呈现后也会在方法内部保留局部值

P5JS-绘制不重叠的圆

每隔3个项目交替显示,然后每1个项目交替显示

JavaScript -复制到剪贴板在Windows计算机上无效

MUI迷你图:如何将$符号添加到MUI迷你图中的工具提示数据

在没有任何悬停或其他触发的情况下连续交换图像

我怎样才能点击一个元素,并获得一个与 puppeteer 师导航页面的URL?

使用Java脚本替换字符串中的小文本格式hashtag

使用VITE开发服务器处理错误

用内嵌的含selenium的Java脚本抓取网站