什么是 SSE
SSE (Server-Sent Events)），即服务器推送事件，是一种在浏览器与服务器之间推送实时数据的技术。它是一种与 WebSocket 相似的技术，但与 WebSocket 不同的是，SSE 是基于 HTTP 的，且 SSE 只支持服务器向客户端推送实时数据，不能实现双向通信。
在 SSE 技术中，客户端通过在 JavaScript 中注册事件监听器来接收来自服务器的数据，当服务器推送数据到客户端时，客户端会触发相应的事件，从而将数据展示在页面上。
Django 中实现 SSE 的步骤
在 Django 中实现 SSE 主要分为以下几个步骤：
在 Django 中创建一个视图函数，用于处理客户端的请求。
使用 HttpResponse 对象来发送 SSE 数据，包括设置正确的 MIME 类型和响应头。
在客户端的 JavaScript 代码中注册事件监听器，用于接收来自服务器的数据。
下面我们将分别介绍这三个步骤。
1. 创建视图函数
在 Django 中创建 SSE 视图函数和创建其他视图函数类似，在视图函数中需要完成以下几个任务：
创建 HttpResponse 对象并设置正确的 MIME 类型：text/event-stream。
添加响应头 Access-Control-Allow-Origin，用于跨域访问。
生成 SSE 数据，并将其通过 HttpResponse 对象发送到客户端。
示例代码：
-- -------------------- ---- -------
- --------
---- ----------- ------ ------------
------ ----
--- -------------
-------- - ----------------------------------------------
------------------------- - ----------
--------------------------------------- - ---
- - -
----- -----
---------------------- --------
--------------------- - - ------ - -------
----------------
-------------
- -- -
------ --------在上面的示例代码中，我们创建了一个名为 sse 的视图函数，该函数不断向客户端推送实时数据（在本例中为数字）。我们使用了无限循环来模拟实时数据的产生和推送，并使用 time.sleep() 函数来控制每秒推送一次数据。
2. 设置响应头和 MIME 类型
在视图函数中设置响应头和 MIME 类型非常重要，如果没有正确的设置，客户端将无法正确接收 SSE 数据。
我们使用 HttpResponse 对象来创建响应，并为其设置正确的 MIME 类型 text/event-stream。
示例代码：
response = HttpResponse(content_type='text/event-stream') response['Cache-Control'] = 'no-cache' response['Access-Control-Allow-Origin'] = '*'
在上面的示例代码中，我们设置了响应的缓存控制为 no-cache，以确保客户端不会缓存来自服务器的数据。同时，我们还设置了响应头 Access-Control-Allow-Origin，以允许跨域访问。
3. 在客户端中接收 SSE 数据
在客户端的 JavaScript 代码中，我们可以使用 EventSource 对象来接收来自服务器的 SSE 数据。
EventSource 对象是一个全局对象，用于处理服务器推送的事件，它包含以下三个事件：
onopen：在连接打开时触发。
onmessage：在收到新消息时触发。
onerror：在发生错误时触发。
在监听事件时，我们需要创建 EventSource 对象，指定 SSE 视图函数的 URL。当服务端推送数据时，onmessage 事件将会被触发，我们可以在该事件的回调函数中处理来自服务器的数据。
示例代码：
var source = new EventSource('/sse/');
source.onmessage = function(event) {
console.log('Received: ' + event.data);
};在上面的示例代码中，我们创建了一个 EventSource 对象，并指定了 SSE 视图函数的 URL。当服务器推送数据时，源对象的 onmessage 回调函数将会被触发，我们将在该回调函数中处理来自服务器的数据。
总结
本文介绍了在 Django 中使用 SSE 实现实时通信的步骤，包括创建 SSE 视图函数、设置响应头和 MIME 类型、和在客户端中接收 SSE 数据。
SSE 技术虽然不如 WebSocket 复杂和强大，但在一些实时数据展示的场景下是一个非常合适的选择。通过本文的介绍，相信您已经了解了如何在 Django 中使用 SSE 技术实现实时通信，希望对您有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6479531a968c7c53b055a3de