django利用html5的sse从服务端向浏览器发数据触发更新

django中
template

<!DOCTYPE html>
<html>
<body>

<h1>Getting server updates</h1>
<div id="result"></div>

<script>
if(typeof(EventSource) !== "undefined") {
  var source = new EventSource("stream/");
  source.onmessage = function(event) {
    document.getElementById("result").innerHTML += event.data + "<br>";
  };
} else {
  document.getElementById("result").innerHTML = "Sorry, your browser does not support server-sent events...";
}
</script>

</body>
</html>

views

import datetime
import time
from django.http import StreamingHttpResponse

def stream(request):
    def event_stream():
        while True:
            time.sleep(3)
            yield 'data: The server time is: %s\n\n' % datetime.datetime.now()
    return StreamingHttpResponse(event_stream(), content_type='text/event-stream')

urls

urlpatterns = [
    path('stream/', views.stream, name='stream')
]
`
``
参考:https://stackoverflow.com/questions/54326515/how-can-i-make-sse-with-python-django
  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在 Django 的前端页面中向后端送指令来更新数据数据,你需要使用 Ajax 技术。 以下是一个简单的例子: 1. 在前端页面中,你需要使用 JavaScript/jQuery 来处理用户的操作。例如,当用户点击一个按钮时,你可以绑定一个 click 事件来触发一个函数。在这个函数中,你可以使用 jQuery 的 ajax() 方法来向后端送指令。 2. 在后端,你需要编写一个视图函数来处理这个指令。这个视图函数需要接收 Ajax 请求,并且根据请求中的数据更新数据库。 3. 在视图函数中,你需要使用 Django 的 ORM(Object-Relational Mapping)来更新数据库。例如,你可以使用模型类的对象来查询和更新数据库表中的数据。最后,你需要返回一个响应对象给前端,以告诉前端操作是否成功。 下面是一个简单的代码示例: 前端页面: ```html <button id="update-btn">更新数据</button> <script> $(document).on('click', '#update-btn', function(){ $.ajax({ url: '/update-data/', // 后端视图函数的 URL type: 'POST', // 请求方式为 POST data: {'data': 'new-data'}, // 送的数据 success: function(response){ alert('数据更新'); }, error: function(){ alert('更新失败'); } }); }); </script> ``` 后端视图函数: ```python from django.http import JsonResponse def update_data(request): if request.method == 'POST': data = request.POST.get('data') # 使用 ORM 更新数据库 ... return JsonResponse({'success': True}) else: return JsonResponse({'success': False}) ``` 当用户点击前端页面中的按钮时,就会向后端送一个 POST 请求,请求的 URL 是 `/update-data/`,请求的数据是 `{'data': 'new-data'}`。后端视图函数会接收这个请求,从 POST 数据中获取 `data` 的值,并且使用 ORM 更新数据库。最后,它会返回一个 JSON 响应,告诉前端操作是否成功。前端页面会根据响应来弹出一个提示框。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值