的WebSockets

Question

我有一个chrome扩展程序从我访问的各种网页中提取数据并将其存储到数据库（Python / Flask）

我还有一个可视化该数据库的仪表板（使用react-create-app node / react / redux）。

我希望每次在数据库中添加/删除/修改记录时都会自动更新仪表板。

据我所知，具体是webhook的用途。

我想做的是创建一个＆＃34;听众＆＃34;在数据库上，以便每次进行更改时，它都会触发对节点服务器的请求。

一些事情：1。）我如何创造＆＃34;某些东西＆＃34;监听数据库中的更改？ 2.）通常我的网页启动一个Web请求并监听回调中的数据。我如何构建它以便它只是倾听＆＃34;对于新的更新？

Answer 1

听起来我觉得这就是你要找的东西：

+- Browser --------+    +---- Browser ---------------+
| Chrome extension |    |    React dashboard         |
+---+--------------+    +-+----+----------------+----+
    |                     |    ^                |
    |                     |    |                |
[C] +         [B]+--------+    |            [A] |
   POST       open a           |  [D]          GET
  (http)      websocket     send websocket    (http)
    |            |      +---message             |
    v            |      |                       v
+-- Server A +---------------+     + Server B --+----+
|                v      |    |     |                 |
| +--------------+------+-+  |     |  +-----------+  |
| | Flask                 |  |     |  |  Node     |  |
| +-----------------------+  |     |  | (hosting  |  |
| +-----------------------+  |     |  |   React)  |  |
| | DB                    |  |     |  +-----------+  |
| +-----------------------+  |     |                 |
+----------------------------+     +-----------------+

[A] 从您的网络浏览器中，您从节点服务器加载React信息中心
[B] 您的react应用程序初始化时会打开与python服务器的websocket连接。 websocket允许浏览器客户端和服务器之间的双向通信 - 请参阅下面的详细信息。
[C] 一段时间后，在您的浏览器中，您的Chrome扩展程序会对您的python服务器进行http调用，从而更新数据库
[D] 您的python服务器在更新数据库后，使用已建立的websocket连接向您的反应应用程序发送websocket消息。然后，您的react应用程序将使用websocket发送的最新数据更新仪表板。

的WebSockets

Websockets 是一种允许服务器和浏览器客户端之间进行双向通信的协议。

您需要：

更新您的反应应用，以便创建websocket连接并侦听更新消息。 There's an npm package for that，但我以前从未使用过它。
更新您的python服务器以接受websocket连接并为每次更新发送websocket消息。 There's a python package for flask that implements websockets - 几年前我曾用这个项目进行学校项目，它就是诀窍。

_{顺便说一下：您不需要两台服务器。您的节点服务器可以处理数据库保存，或者您的python / flask服务器可以为React应用程序提供服务。}

Answer 2

当您在处理CRUD更改的烧瓶应用程序中收到的每个请求中从节点服务器请求页面时，您实际上创建了一个Web挂钩（一个服务器请求或发布另一个服务器）。您可能希望将其卸载到后台线程或作业系统，例如beanstalkd。为您提供异步webhook调用。如果您希望您监控的页面也更新，您可能会对Web套接字感兴趣。

在Flask中创建webhook

2 个答案:

的WebSockets

您需要：