介绍
对于前端开发人员来说，实时通信是非常重要的。Pusher是一个提供实时通信的即时API的服务，可以让我们轻松地向网页或者移动应用程序添加实时功能。
pusher-client 是一个 Pusher 客户端 JavaScript 库，可以让我们在浏览器或 Node.js 中使用 Pusher API。
在这篇教程中，我将向你介绍 pusher-client 的安装和使用。你可以在本文中了解如何在你的应用程序中集成实时 Pusher 网络通信服务。
安装
pusher-client 可以通过 npm 安装：
npm install pusher-client
pusher-client 也可以从 CDN 中引用：
<script src="https://js.pusher.com/7.0/pusher.min.js"></script>
使用
创建一个 Pusher 实例
创建 Pusher 实例时需要提供一个 app key。你可以在 Pusher 控制面板 中找到你的 app key。
const Pusher = require('pusher-client');
const pusher = new Pusher('YOUR_APP_KEY', {
cluster: 'YOUR_APP_CLUSTER',
encrypted: true
});绑定事件监听器
我们需要为 Pusher 实例绑定事件监听器以便接收事件数据。
const channel = pusher.subscribe('my-channel');
channel.bind('my-event', function(data) {
console.log('Received message: ' + data.message);
});在上面的代码中，我们订阅了 my-channel 频道，并绑定了一个 my-event 事件的监听器。
当事件被触发时，Pusher 客户端库将自动向我们的监听器传递事件数据。在这个例子中，我们只是把数据输出到控制台。
触发事件
我们也可以使用 Pusher 客户端库触发事件。
const channel = pusher.subscribe('my-channel');
channel.trigger('my-event', {
message: 'Hello World!'
});在上面的代码中，我们订阅了 my-channel 频道，并触发了一个 my-event 事件。
示例代码
复制以下源代码到 HTML 文件中，然后打开控制台查看输出结果：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
-------------------- ---------------
------- -------------------------------------------------------
-------
------
--------
----- ------ - --- ---------------------- -
-------- -------------------
---------- ----
---
----- ------- - -------------------------------
------------------------ -------------- -
--------------------- -------- - - --------------
---
--------------------------- -
-------- ------ -------
---
---------
-------
-------结论
pusher-client 是一个强大的工具，可以轻松地向网页或者移动应用程序添加实时功能。这篇文章介绍了如何使用 pusher-client 实现实时通信功能，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/79395