本文将为大家介绍如何使用.NET Core实现SSE(服务端发送事件)服务器。SSE是一种用于在Web浏览器和服务器之间进行实时双向通信的协议。 本文重点介绍.NET Core如何通过建立SSE连接发送持续更新的消息，以及如何接收SSE消息并将其显示在Web应用程序中。
需求分析
在介绍如何使用.NET Core实现SSE服务器之前，我们首先需要了解SSE的一些基本概念和要求:
- SSE连接是一种单向连接，只能从服务器向浏览器发送消息。
- SSE连接以“text/event-stream” MIME类型的HTTP响应格式发送。
- 服务器必须发送“Content-Type: text/event-stream” HTTP头以表示SSE连接。
了解SSE的基本要求后，我们需要确定我们要实现的SSE服务器的具体功能。 在这个项目中，我们主要实现以下功能:
- 在服务器建立SSE连接时，向客户端发送欢迎消息。
- 客户端可以通过WebSocket与服务器建立一个持续的连接。
- 服务器随机生成一个数字，并将其定期发送到所有连接的客户端。
- 客户端可以通过发送“订阅”消息来注册接收服务器发送的数字。
.NET Core SSE服务器实现
创建.NET Core项目：打开Visual Studio，点击“文件”→“新建”→“项目”，选择“ASP.NET Core Web应用程序”。在下一步中，我们选择“Web应用程序(MVC)”模板，创建项目。在项目成功创建后，在Solution Explorer中，双击“Startup.cs”文件打开文件。
添加中间件：在startup.cs文件中添加“UseMvc”中间件。
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
//省略其他中间件
app.UseMvc();
}- 添加控制器：我们将SSE服务器代码放置在一个名为SSEController的控制器中。 SSEController的核心功能是处理响应SSE客户端请求。
-- -------------------- ---- -------
----- -------
----- ---------------------------
----- ------------
----- -----------------------
----- -------------------------
------ ----- ------------- - ----------
-
----------
------- ----- ------ --------- - ---------------
---------------
------ ----- ---- -------
-
------------------- - ----
------------------------------------ ---------------------
----- ---------------------------
----- --------------------
----- -----------------
-
-----------
------ ----- ---- ----------
-
--- -------- - --------------
------------------- - ----
--------
----- ------------- ------ - --- ---------------------------
-
------ ---- - -------------------
-- ----- -- ------------
-
----------------------------------
----- -----------------
-
-
-
-- 实现SSE事件消息发送: SSE事件格式要求我们在每条事件消息之间需要有一个空行。在该代码中,我们从SSE控制器向客户端实时发送数字。
-- -------------------- ---- ------- ------- ----- ---- ------------------------------ ------------- - --------------- ------ - - --- --------------------------------- --- ------ - --------- ----- ------ ----------- - -------------------- --------- -------- ------ ---------- - ------------------------------------ ----- ----------------------------------- -- ------------------- -
实现欢迎消息发送，发送一个名为"welcome"的空事件。
-- -------------------- ---- ------- ------- ----- ---- ------------------- - ------ ------------- - ---------------------------- ----------- ------ ------------ - -------------------------------------- ----- -------------------------------------- -- --------------------- ------ ------- - ------------------------------- ----- --------------------------------- -- ---------------- -
添加路由规则：在Startup.cs文件中添加路由规则。
-- -------------------- ---- ------- ----- ----------------------------- ------ ---- ----------------------------- ---- ------------------- ---- - --------- ----------------- -- - ---------------- ----- ------ --------- ------ --------- --- - ---------- - ------ ------ - ------- --- ---------------- ----- ----------- --------- --------------- --------- --- - ---------- - ------ ------ - ---------- --- --- -
至此，一个基本的.NET Core SSE服务器就完成了。我们完成了SSE连接的建立，发送欢迎消息，接收“订阅”消息，以及SSE事件消息的发送。
客户端实现
接下来，我们将演示如何建立WebSocket连接，并在浏览器中接收服务器发送的数字。 该例子使用JavaScript编写。
在HTML页面中添加WebSocket：
-- -------------------- ---- ------- --------- ----- ------ ------ ---------- ------------ ------- ----------------------------------------------------------- -------- ------------ - --- --------- - --- ------------------------------------- ------------------- - --------------- - -------------- --- ---- - ----------- -- ------------ - -- - -- ----------------------------- - --- - --- ------ - --------------------- ----------- ------------------------------------------- - ------- - - -- ----------------- - --------------- - ---------------------- ----- ----------- -- -- --------- ------- ------ ------- --------- ------ ------ -- ----- ------------------------ ------- -------添加“订阅”按钮：添加一个HTML按钮，当单击它时客户端向服务器发送“订阅”消息。 我们将其添加到上面的HTML页面中。
<button onclick="subscribe()">Subscribe</button>
添加“订阅”JavaScript函数：添加JavaScript函数，该函数创建XMLHttpRequest对象并向“/sse/register”URL发送“订阅”消息。
-- -------------------- ---- ------- -------- ----------- - --- --- - --- ----------------- ---------------- ---------------- ------ ---------------------- ---------------------- - ---------- - -- --------------- --- -------------------- - -- ----------- --- ---- - ----------------------- --------------- - - -- -
至此，我们已经创建了一个SSE服务器和客户端，并建立了一条WebSocket连接。 要运行此示例，请在Visual Studio中启动.NET Core项目并在浏览器中打开带有“http://localhost:5000”的HTML文件。
总结
通过本文，我们了解了如何使用.NET Core实现SSE服务器，并通过建立WebSocket连接在浏览器中接收服务器发送的消息。 SSE是一种非常强大的技术，并且可以用于众多实际应用场景中，例如数据可视化和实时通知等。 在今天的Web应用程序中，实时通信已经变得非常普遍，并且SSE可以帮助我们实现与客户端的实时通信。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/646444ea968c7c53b0525f4a