python - 在 Flask 中创建 webhook

Question

我有一个 Chrome 扩展程序，可以从我访问的各个网页中提取数据并将其存储到数据库(Python/Flask)

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

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

据我了解，这就是 webhook 的具体用途。

我想要做的是在数据库上创建一个“监听器”，以便每次进行更改时，它都会向节点服务器发出请求。

一些事情:1.)如何创建“某些东西”来监听数据库中的更改？ 2.) 通常我的网页会发起网络请求并监听回调中的数据。我如何构建它，以便它只是“监听”新的更新？

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 连接向您的 React 应用程序发送一条 websocket 消息。然后，您的 React 应用程序使用通过 websocket 发送的最新数据更新仪表板。

Websocket

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

您需要:

1. 更新您的 React 应用程序，以便它创建 WebSocket 连接并监听更新消息。 There's an npm package for that ，但我以前从未使用过它。
2. 更新您的 python 服务器以接受 websocket 连接并为每次更新发送 websocket 消息。 There's a python package for flask that implements websockets - 几年前我在一个学校项目中使用过这个，它确实起到了作用。

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