在前端开发中，我们经常会需要使用第三方库来实现某些功能，比如获取视频信息，订阅消息等。其中，twitchwebsub 就是一个非常实用的 npm 包，可以帮助我们在 Twitch 上进行 WebSub 订阅。
本篇文章将会详细介绍如何使用 twitchwebsub 来进行 Twitch 的 WebSub 订阅，并提供示例代码以帮助你更好地理解和应用这个库。
Twitch WebSub
WebSub（之前称为 PubSubHubbub），是一个发布/订阅协议，它可以让网站或应用程序对内容进行实时的推送通知。Twitch 是一个流媒体平台，它提供了一个 WebSub API，让我们可以实时地订阅 Twitch 圈子内的事件，如用户关注、取消关注等等。
安装 twitchwebsub
使用 twitchwebsub 需要进行安装，直接在终端输入以下命令即可：
npm install --save twitchwebsub
订阅 Twitch WebSub
订阅 Twitch WebSub 需要进行以下步骤：
- 获取 Twitch WebSub 订阅 URL
- 创建订阅请求
- 接收订阅确认
- 订阅回调
获取 Twitch WebSub 订阅 URL
首先，我们需要获取 Twitch WebSub 订阅 URL。此 URL 可以通过 Twitch API 获取。订阅 URL 会根据你需要订阅的内容而发生变化，比如若要订阅用户的关注事件，订阅 URL 为：
https://api.twitch.tv/helix/users/follows?first=1&to_id=<user_id>
创建订阅请求
创建订阅请求需要一个订阅对象，该对象应包含以下信息：
const subscription = {
topic: '<订阅 URL>',
callback: '<订阅回调 URL>',
lease_seconds: <订阅租期>,
secret: '<订阅的 shared secret>',
};其中，订阅 URL 是上一步获取到的 Twitch WebSub 订阅 URL；订阅回调 URL 是你设置的将被调用来处理订阅事件的 URL；订阅租期是指订阅持续的秒数，默认值为 864000（10 天）；shared secret 可以用于校验订阅事件，可选。
接收订阅确认
接着，我们需要接收 Twitch WebSub 订阅确认。订阅确认表示 Twitch 已经收到了你的订阅请求，并确认你的订阅请求是有效的。接收 Twitch WebSub 订阅确认可通过以下代码实现：
-- -------------------- ---- -------
----- ------------ - ------------------------
----- - ------ - - ------------------------
----- ------ - --- --------- -- ------
----- ------------ - --- -------------- ------ ---
----- ----- - ---- ------
----- -------- - ------ ------
----- ------------ - -------
----- ------ - ----- ------ ---------
-----------------------
- ------ --------- ------------- ------ -- -- ----
-- -- ------------------ ----------- -- ---------
-- -- --------------- -------- ----- -- ---------
--订阅回调
最后一步，我们需要定义一个订阅回调函数，用于处理 Twitch WebSub 订阅事件。当 Twitch 上发生相应的事件时，我们的订阅回调函数将被触发，来处理相关事件。订阅回调函数需要包含以下参数：
const callback = (data, headers, secret) => {
// 处理订阅事件
}其中，data 包含了触发订阅事件的相关内容，headers 包含了请求头信息，secret 是缺省或已设置的订阅 shared secret。
订阅回调函数的具体实现因特定业务而异，下面我们提供一个范例代码，演示如何处理 Twitch 上用户关注事件的订阅回调：
-- -------------------- ---- -------
----- ------- - -------------------
----- ---------- - -----------------------
----- ------------ - ------------------------
----- - ------ - - ------------------------
----- ------ - --- --------- -- ------
----- ------------ - --- -------------- ------ ---
----- ----- - ---- ------
----- -------- - ----------------------------------------- -- ---- ---
----- ------------ - ------- -- ----
----- ------------ - ---- ------ --------- -- -------------
----- --- - ----------
---------------------------
-- --------
----- ----------------------- - ------ -------- ------- -- -
----------------- ------ ------ ----- -- ----------------------
----- --------- - -----------------------------
----- ------ - ---------------------
----- -------- - -----------------------
-- ---------- --- --------------- -
------------------------ --------
-
--
----------------------------- ----- ---- -- -
--------------------
------------------------------- ---- ------------------------ --------------
---
-----------------------
- ------ --------- ------------- ------------ --
-- -- ------------------ -----------
-- -- --------------- -------- -----
--
-- ------
---------------- -- -- -
---------------------
---在以上代码中，我们首先创建了一个 express 应用程序，接着在订阅回调处理函数 handleSubscribeCallback 中，提取了所需信息（包含清楚的用户相关信息和订阅事件），并在 console 中输出了一个消息。最后通过调用 subscribe() 方法创建了一个 Twitch WebSub 订阅。
总结
本篇文章详细介绍了如何使用 npm 包 twitchwebsub 来进行 Twitch 的 WebSub 订阅。我们通过对 Twitch WebSub 订阅的讲解，帮助读者了解了该协议的实际应用场景，而在代码示例的学习过程中，读者学习到了如何订阅 Twitch WebSub 并处理订阅事件的技能。希望这篇文章能够帮助读者理解和应用 Twitch WebSub，提升前端开发技术。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005664b81e8991b448e26a3