跳转到主要内容
Chinese, Simplified

在Kafka系列的事件驱动微服务的最初文章(见这里)中,我讨论了使用事件驱动通信和Kafka实现有状态微服务而不是标准的无状态rest服务的优点。

我还介绍了一个相关概念证明应用程序的架构和源代码。

在本文中,我想展示如何将异步事件驱动的通信从Kafka扩展到通过Java后端的Web前端。

因此,在本系列的第一篇文章中,我们去掉了HTTP作为后端微服务之间的通信协议,现在我们也将它(用WebSockets)替换为前端和后端之间的通信协议。

好吧,但你为什么要这么做?

因为它为最终用户提供了更好的体验!。

使用WebSockets可以构建合法的实时用户界面,更新会立即从服务器推送到客户端,用户无需单击任何按钮或刷新浏览器。

等等,但是我们也可以使用好的旧HTTP,不是吗?

好。。。HTTP不是为提供实时通信而设计的,但由于人们确实需要它,因此在它之上创建了许多解决方法和技术,例如:

  • Long polling
  • Short polling
  • Server-Sent Events

那不过是些黑客,IMHO.。

另一方面,WebSockets提供全双工双向通信,这意味着信息可以从客户端流向服务器,同时也可以反向流动,它不能获得比这更多的实时性(这就是我之前说的“合法实时应用程序”的意思)。

Image depicting the differences between HTTP and WebSockets

HTTP vs WebSockets (source: https://blogs.windows.com/windowsdeveloper/2016/03/14/when-to-use-a-htt…)

例子

我在上一篇文章中使用的同一个PoC应用程序中添加了一个新服务,同时还添加了一个角度web前端。

好吧,但这项新服务有什么用?

它允许前端用户接收有关她/他选择的任何帐户当前余额的信息,以及余额更改时的实时更新。

此外,还向用户显示与当前所选账户(即贷记或借记的任何金额)过去或现在相关的任何交易的信息。

架构

新的Transfers WebSockets服务的主要组件包括:

  • 两个Kafka使用者(每个主题一个)从Kafka集群检索消息
  • 两个Kafka流本地存储以检索与给定密钥(id)关联的最新数据
  • 使用简单映射存储给定帐户的事务列表实现的自定义本地存储。
  • 两个Dispatcher,跟踪注册哪些WebSockets会话(即前端客户端)以接收与哪个帐户相关的实时余额更新或实时新传输数据,然后相应地发送更新。

这些是角前端的主要组成部分:

  • 一个WebSockets服务,它处理连接生命周期并将接收到的消息分派给相应的RxJS主题。请注意,不同类型的JSON消息(请求、响应和更新)通过惟一的WebSockets连接流动。
  • 将用户输入(即所选帐户的id)传递给WebSockets服务以便将其发送到远程服务器的窗体。
  • 一种角度组件,用于显示帐户余额,该帐户余额通过RxJS观察者异步通知余额的变化(更新),RxJS观察者订阅了前面提到的WebSockets服务中相应的RxJS主题,然后相应地重新呈现该值。
  • 另一个角度组件,与前一个组件类似,异步通知与所选帐户相关的任何新事务,并将其添加到显示的事务数据列表中。

Image depicting the PoC application components

行动起来

GIF depicting the Web UI in action

查看这个Youtube视频进行演示,在这个演示中,一个连续生成Kafka消息(表示随机资金转移)的测试过程被用来为应用程序提供数据。

而在Web用户界面上,用户可以看到转账发生时是如何弹出的,相关账户的余额也会相应地发生变化,所有这些都是实时的。

 

 

 

 

 

 

最后的想法

HTTP协议已经取得了巨大的成功,它使我们今天所知道的WWW成为可能。

它非常成功,已经扩展到了后端(RESTful服务和开放API),在那里它已经成为国王十多年了。

然而,技术不断发展,范例不断出现,对于某些用例,其他工具和设计可能是更好的选择。

我不知道未来的软件应用程序会是什么样子,我只能猜测。

事件驱动的微服务看起来非常强大,用Kafka实现它们并将WebSockets添加到组合中似乎很有希望。

事实上,一些公司能够看到REST API之外的东西,并开始向他们的客户提供Websockets API,以便更快地流式访问数据(例如)。

还有其他实现事件驱动微服务的替代方法,例如,最近我了解了Uber Cadence,但这是以后的文章

 

原文:https://dev.to/victorgil/kafka-websockets-angular-event-driven-microservices-all-the-way-to-the-frontend-12aa

本文:

讨论:请加入知识星球或者微信圈子【首席架构师圈】

Tags
 
Article
知识星球
 
微信公众号
 
视频号