Pusher实时通信初体验

  • 2022年9月19日
  • 技术

pusher是什么?

按照官方说的说法pusher是为移动和网络提供实时体验。灵活、可扩展且易于使用的双向托管 API。我们创建和维护复杂的消息传递基础架构,因此您可以快速构建用户需要的实时功能。

说简单点就是利用WebSocket或HTTP来实现持久化实时通信的库。

通信流程

1,客户端直接与Pusher建立通信;

2,客户端发送数据到直接服务器;

3,服务器接收数据将数据转发给Pusher;

4,Pusher再将数据推送到客户端。

这里可以看出Pusher的身份就是一个中转站,只提供通信服务,其他的逻辑层都需要自己去处理,让业务也不容易混淆。

注册

进入官网注册账号,创建Channels,就会得到相对应的app_id,secret和key了,至于区域就根据实际情况来就行,目前没有国区,选择亚洲服务器是最优的。

基本入门

客户端

创建网页

<!DOCTYPE html>
<head>
    <title>Private channels</title>
    <script src="https://js.pusher.com/7.0/pusher.min.js"></script>
    <script>
        //建立通信
        const pusher = new Pusher('YOUR_kEY', {cluster: 'ap3'});

        //订阅
        function subscribe() {
            var channel = pusher.subscribe('my-channel');
            channel.bind('my-event', function(data) {
              alert(JSON.stringify(data));
            });
        }

        //取消订阅
        function unsubscribe(){
          pusher.unsubscribe('my-channel');
        }

    </script>
</head>
<body>
    <button onclick="subscribe()">订阅</button>
    <button onclick="unsubscribe()">退订</button>
</body>

服务端:

这里用的node.js来举例,同时Pusher官方是支持多种语言的,如PHP,Go,Ruby,Python,Java等等。

首先安装pusher包

npm install pusher

然后创建文件channel_server.js

const Pusher = require("pusher");

const pusher = new Pusher({
    appId: "YOUR_APPID",
    key: "YOUR_kEY",
    secret: "YOUR_SECRET",
    cluster: "ap3",
    useTLS: true
});

pusher.trigger("my-channel", "my-event", {
    message: "hello world"
});

执行文件

node channel_server.js

最后,根据客户端网页订阅或者退订就可以接收消息了。

好了,这就是Pusher的基本使用。

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注