python学习之flask(三)-前端页面

本文介绍了使用Python的Flask框架进行前端页面开发的基础知识,内容聚焦于两个输入框和一个按钮的实现,利用jQuery进行交互操作。
摘要由CSDN通过智能技术生成
	<div>
        歌手:<input type="text" class="authorIpt"><br>
        歌曲名:<input type="text" class="nameIpt"><br>
        <button class="submit">提交</button>
    </div>
    <div>
        <ul class="music">这里是歌手的列表</ul>
    </div>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js">
	</script>

就两个输入框 和一个按钮
在这里插入图片描述
在这里插入图片描述
前端部分就直接贴代码了 用的jquery

    let m = {
        
Flask中实现前端实时显示后端处理进度可以通过使用WebSocket技术来实现。WebSocket是一种基于TCP的协议,可以实现双向通信,使得前后端能够在同一个连接上进行实时的数据交换。 首先,我们需要在Flask中使用WebSocket,可以使用Flask-SocketIO来方便地实现WebSocket功能。安装Flask-SocketIO后,我们可以在Flask应用中使用socketio对象来实现WebSocket的功能。 在后端代码中,我们可以通过在任务处理函数中发送进度信息给前端。例如,我们可以在任务处理函数的循环中,使用socketio的emit函数发送当前任务的进度信息。前端页面将通过监听WebSocket消息的方式接收进度信息。 在前端代码中,我们需要在页面中引入SocketIO的JavaScript库,并创建一个SocketIO对象。然后,我们可以使用socket.on()函数来监听后端发送的进度信息,并根据接收到的进度信息来更新前端页面上的进度显示。 需要注意的是,为了防止过多的WebSocket连接导致性能问题,我们可以考虑使用Flask-SocketIO提供的命名空间和房间功能。通过使用命名空间和房间,我们可以将客户端分组,只向特定的客户端发送进度信息。 总结起来,实现Flask前端实时显示后端处理进度的关键步骤是:在Flask应用中使用Flask-SocketIO实现WebSocket功能,后端任务处理函数中使用socketio对象发送进度信息,前端页面中使用SocketIO对象监听进度信息并更新页面显示。这样就能够实现前端实时显示后端处理进度的功能了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值