ajax定时局部刷新flask,Django+JQuery实现定时刷新局部页面
简介
在做“弹幕弹幕”小程序管理员前端时,需要在页面上不断更新弹幕列表,方便管理员对弹幕进行审核。之前用flask框架可以使用主动推送的方式更新前端页面,但是Django框架要实现主动推送是比较复杂的,于是我们最后使用了轮询的方式进行页面更新。
实现方法
项目架构(部分目录)
.
├── organizer/
| ├── views.py
| └── urls.py
└── templates/
├── barrages_list.html
└── barrages_refresh.html
实现原理
前端页面通过JQuery定时向后端发送GET请求,获取最新的数据库数据之后,更新局部页面的内容。
代码实现
1、barrages_list.html中的主要代码:
//定时刷新界面(0.5秒)
$(document).ready(function(){
setInterval(function() {
$.get("{% url 'barrages_refresh' %}" + window.location.search,//GET请求的url地址
function(data,status){
$("#barrages_list").html(data);//更新列表内容
});
}, 500);
});
2、barrages_refresh.html中的主要代码:
{% for barrage in data %}
{{ barrage.content }}
通过
不通过
{% endfor %}
3、views.py中的主要代码:
class BarragesRefresh(APIView):
def get(self):
self.template="organizer/barrages_refresh.html"#渲染的模板
self.check_input('activity_id')
activity_id = self.input['activity_id']
barrages = Barrage.objects.filter(activity_id=activity_id, has_checked_manually=False)
barrages = list(barrages.values("id", "type","content", "openid", "screen_id"))
return barrages
4、urls.py中的主要代码:
urlpatterns = [
url('barrages/refresh', BarragesRefresh.as_view(),name='barrages_refresh'),
]
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐


所有评论(0)