Javascript 如何使用websocket从数据库获取数据来刷新视图

我需要刷新视图的一部分而不刷新整个页面

在我的index.html页面上，我有三个面板，其中一个按状态显示票证数量，每次创建或更新新票证时，我都需要刷新此数量。我使用Java和Spring Boot以及Thymelaf来构建我的应用程序

我的看法是：

我现在就是这样做的：

model.addAttribute("resolvedTickets", atendimentoService.findAllTicketsByStatus(STATUS_RESOLVED).size());

---

我曾尝试使用web

套接字

，但我不知道如何获取该套接字并刷新面板。

在标准web交互中，客户端（即您的web浏览器）向服务器发送请求。您的服务器接收到请求，并发回要在浏览器中显示的信息，然后终止连接

WebSocket是在客户端和服务器之间创建持久的双向连接的一种方法，但它需要两者的合作。很多共享服务器都不允许WebSocket，因此您首先必须确保您的服务器能够提供WebSocket。（我从您的屏幕截图中看到，您运行的是Heroku，运行WebSocket应该没有问题。）

在服务器端，您需要设置传入WebSocket请求的处理。我不知道您用什么语言编写了服务器，所以我无法提供任何指导，但有很多库用大多数语言编写了WebSocket的服务器端部分

在客户端，您需要设置WebSocket客户端。MDN在WebSocket上提供了一个解释您需要做什么的工具。基本上，您所要做的就是侦听传入的消息并增加计数器

var count = 0;
var exampleSocket = new WebSocket("ws://example.com/socket");
exampleSocket.onmessage = function(event) {
    count++;
    document.getElementById('myTicketCounter').innerHTML = count;
}

---

在某些方面，websocket是过度的。如果您发现这是太多的工作而报酬太少，那么您也可以设置一个AJAX调用，每隔几分钟触发一次，在服务器上ping另一个页面，并相应地返回票证数量和更新。它不会是瞬间的，但是如果你不需要第二个分辨率，它可能就足够了。您可以将间隔调整为任意长或任意短（在一定程度上，不断的请求轰炸您的服务器会使您的速度减慢一点）。

Hi！非常感谢你的主人。我正在使用Java和Spring Boot构建我的应用程序。