pusher之JS文档阅读
特点介绍文档
https://pusher.com/features
Flexible Pub/Sub Messaging 灵活的发布和订阅消息
即时更新浏览器,手机和物联网设备,简单的事件API
Live user lists (presence)时时用户列表
在线频道能够实时显示用户在线或离线状态,让聊天和协作应用程序的开发变得简单。
Access control/authentication 访问控制/认证
我们提供了一个安全的机制来控制谁可以访问给定的渠道,与您现有的认证策略无缝集成。
Integrations
在Slack中获取警报,在Datadog中将度量指标发送到仪表板等等。
以上蹩脚翻译,请自行查看文档
免费服务限制
100个连接,20万条消息,和无限制的频道
快速入门
首先需要注册一个帐号,取得key和ID等消息
前端HTML文件
//引入
<script src="https://js.pusher.com/4.2/pusher.min.js"></script>
创建初始化
var pusher = new Pusher('APP_KEY', {cluster: 'APP_CLUSTER',//创建应用的时候分配的
});
订阅一个通道channel
var channel = pusher.subscribe('my-channel');
监听你订阅的channel事件
channel.bind('my-event', function(data) {alert('An event was triggered with message: ' + data.message);
});
my-event事件名字
Server发布
这里暂时不说使用框架,直接原生,框架后续有文章
composer require pusher/pusher-php-server
新建一个file
<?php
require __DIR__ . '/vendor/autoload.php';$options = array('cluster' => 'ap1','encrypted' => false,//是否使用https,443接口,默认我用的http.所以这个需要设置false);
$pusher = new Pusher\Pusher('0a8d7355056b24XXXX','b0053f60430a34xxxxx','522xxx',$options
);
//发布消息
$data['message'] = 'hello world';
$data['name'] = 'kongqi';
$pusher->trigger('my-channel', 'my-event', $data);
执行这个文件,浏览器打开或者是命令执行即可
exp
http://localhost/ww/pusher.php
php -e E:\website\ww\pusher.php
一个快速的消息订阅和发布就这么简单啦
通道channels
1、通道类型channel types
a,公共通道public channels
订阅
var channel = pusher.subscribe(channelName);
退订
pusher.unsubscribe(channelName);
绑定事件
channel.bind(eventName, callback);var pusher = new Pusher('APP_KEY');
var channel = pusher.subscribe('APPL');
channel.bind('new-price',function(data) {// add new price into the APPL widget}
);
绑定事件上下文
var context = { title: 'Pusher' };
var handler = function(){console.log('My name is ' + this.title);
};
channel.bind('new-comment', handler, context);
解除绑定
channel.unbind(eventName, callback);var pusher = new Pusher('APP_KEY');
var channel = pusher.subscribe('APPL');
var callback = function(data) {};
channel.bind('new-price', callback);// Remove just `handler` for the `new-price` event 删除刚创建的绑定
channel.unbind('new-price', handler);// Remove all handlers for the `new-price` event 删除所以这个名字的绑定
channel.unbind('new-price');// Remove all handlers on `channel` 删除这个通道的所有绑定事件
channel.unbind();
绑定成功监听
channel.bind('pusher:subscription_succeeded', function() {
});
绑定错误监听,返回HTTP状态码
···
channel.bind('pusher:subscription_error', function(status) {
});
···
绑定在客户端上
pusher.bind(eventName, callback);var pusher = new Pusher('APP_KEY');
var channel1 = pusher.subscribe('my-channel-1');
var channel2 = pusher.subscribe('my-channel-2');
var channel3 = pusher.subscribe('my-channel-3');var eventName = 'new-comment';
var callback = function(data) {// add comment into page};// listen for 'new-comment' event on channel 1, 2 and 3
pusher.bind(eventName, callback);
触发客户端事件,返回真假
var triggered = channel.trigger(eventName, data);
b,私有通道 private channels
c,存在在线频道presence
2、通道命名channel 名字命名约定
频道名称只能包括小写字母,大写字母,数字和以下标点符号_ - = @ , . ;
### As an example
foo-bar_1234@=,.;
3、认证通道channel
如果某个频道已经订阅,则可以通过pusher.channel按名称访问频道
var channel = pusher.channel(channelName);
连接参数
文档
https://pusher.com/docs/client_api_guide/client_connect#encrypting-connections
{cluster: 'APP_CLUSTER',encrypted: true, // true/falseauth: {params: { // {key: value} pairsparam1: 'value1',param2: 'value2'},headers: { // {key: value} pairsheader1: 'value1',header2: 'value2'}}
}var pusher = new Pusher('app_key', {auth: {params: {CSRFToken: 'some_csrf_token'}}
});
消息加密
认证签名
默认是'pusher/auth'
认证发起请求类型
ajax,jsonp
状态事件
//初始化
initialized
//进行连接
connecting
//连接完成
connected
//连接不可用
unavailable
//连接失败
failed
//断开
disconnected
pusher.connection.bind('connected', function() {$('div#status').text('Realtime is go!');
});
state_change 连接状态改变事件监听
connecting_in 尝试重新连接监听
断开
···
pusher.disconnect();
···
私人认证订阅例子
html
Pusher.logToConsole = true;var pusher = new Pusher('0a8d7355056b24b3xxxx', {cluster: 'ap1',encrypted: true,authEndpoint: 'pusher_auth.php',//认证的文件,authTransport:'ajax',//默认使用的,会自动发送socket_id(相当于唯一的用户ID),channel_name});var channel = pusher.subscribe('private-my-channel');
channel.bind('event', function(data) {console.log(data);alert(data.message);});channel.bind('pusher:subscription_succeeded', function() {console.log('通道成功绑定');});channel.bind('pusher:subscription_error', function() {console.log('通道失败绑定');});
pusher_auth.php
<?php
require __DIR__ . '/vendor/autoload.php';$options = array('cluster' => 'ap1','encrypted' => false,);$pusher = new Pusher\Pusher('0a8d7355056b24bXXX','b0053f60430a348cXXX','522838',$options);if ( 1 )
{echo $pusher->socket_auth($_POST['channel_name'], $_POST['socket_id']);
}
else
{header('', true, 403);echo "Forbidden";
}
?>
成功会输出
{"auth":"0a8d7355056b24b3dcd9:9ffdb530fe232145d61ae687258323800353b12e68ba91d2db41010655d26ed3"}
presence channel 认证
html
// Enable pusher logging - don't include this in productionPusher.logToConsole = true;var pusher = new Pusher('0a8d7355056b24b3dcd9', {cluster: 'ap1',encrypted: true,authEndpoint: 'pusher_auth.php',});var channel = pusher.subscribe('presence-my-channel');
channel.bind('event', function(data) {console.log(data);alert(data.message);});channel.bind('pusher:subscription_succeeded', function(data) {console.log('通道成功绑定');console.log(data);});
channel.bind('pusher:subscription_error', function() {console.log('通道失败绑定');});
php
<?php
require __DIR__ . '/vendor/autoload.php';$options = array('cluster' => 'ap1','encrypted' => false,);$pusher = new Pusher\Pusher('0a8d7355056b24b3XXX','b0053f60430a348c4XXXa','522838',$options);if ( 1 )
{//echo $pusher->socket_auth($_POST['channel_name'], $_POST['socket_id']);$user=['id'=>1,'name'=>'kongqi'];echo $pusher->presence_auth($_POST['channel_name'], $_POST['socket_id'], $user['id'], $user);
}
else
{header('', true, 403);echo "Forbidden";
}
?>
pusher之JS文档阅读相关推荐
- two.js文档阅读笔记-two.js的基本使用
介绍 two.js是一个前端绘制2d图形的api.可以使用svg,canvas,webgl进行渲染. 基本使用 代码如下: <!DOCTYPE html> <html lang=&q ...
- ExtJS4 API文档阅读(四)——Data
2019独角兽企业重金招聘Python工程师标准>>> ExtJS4 API文档阅读(四)--Data 数据 Data包负责加载和保存你应用程序中的所有数据,由41个类构成,其中有三 ...
- Blockly学习之文档阅读笔记
文档阅读来源--谷歌官网介绍: https://developers.google.com/blockly/guides/overview 概述 一个用于Web.Android.iOS的可视化代码编辑 ...
- Flink中GroupWindow和OverWindow各自的作用+window体系+文档阅读方式
GroupWindow和OverWindow各自的作用 Flink Window 作用 完整实例 GroupWindow 对window中的数据按照字段进行分组 完整案例 OverWindow 在整个 ...
- TurboMail手机客户端—强大的附件文档阅读能力
2019独角兽企业重金招聘Python工程师标准>>> 对于频繁使用邮件的用户而言,收发附件已是家常便饭,但对于手机查看附件,用户却遇到了很多问题.稍微低端的手机,除了txt格式的文 ...
- Qt文档阅读笔记-共享库的创建与调用
使用共享库的符号 这个符号可以作用在变量.类.函数中,并且这些都可以被调用端使用. 在编译共享库中,需要使用export符号.在使用端调用的时候使用import符号. 这里是本人从文档中记录的笔记,大 ...
- Qt文档阅读笔记-加载HeightMap(高度图)构造3D地形图
Qt文档阅读笔记-加载HeightMap(高度图)构造3D地形图 QHeightMapSurfaceDataProxy:是Q3DSurface的一个基本代理类. 他是专门加载高度图. 高度图是没有X, ...
- Qt文档阅读笔记-Rotations Example相关
Rotations Example文档阅读笔记 使用这种方式,对y轴和z轴进行旋转. QQuaternion yRotation = QQuaternion::fromAxisAndAngle(0.0 ...
- 阅读器java_纯Java文档阅读器
XDocViewer是一个纯Java的文档阅读器组件,可以方便的集成到Java应用中(也可以集成到Web应用中),它有如下特点: 1.免费 2.支持的文档格式丰富:MS Office文档(doc.do ...
最新文章
- mini-uboot 启动过程简单分析
- 【微信开发】微信公众号开发 之 编辑模式使用
- 强烈推荐!分享一个持续连载的《特征工程小锦囊》项目,代码已开源!
- Linux调度系统全景指南(终结篇)
- 深度linux添加xp,Linux和Windos XP下向路由表添加路由
- vb.net label 不要自动换行_自动驾驶小车——(四)数据采集
- BZOJ 3782 上学路线 ——动态规划 Lucas定理 中国剩余定理
- 后台返回数据时,接口设计规范参考
- REST是否会步SOAP的后尘?
- 如何固定电脑桌面便签 win7便签怎么设置?
- 实战Kaggle比赛(二)——房价预测
- python font 斜体_用PIL绘制粗体/斜体文字?
- 复用推挽输出与推挽输出区别
- ASPxGridViewHelper自定义多表头及合并单元格
- 朋游风景:让智能手机成为贴身导游
- 苹果xr黑屏转圈圈解决方法_iPhonexr黑屏转圈怎样解决?
- 植物代谢组学-线虫信息素的植物代谢介导植物与线虫的相互作用
- 顺丰速运扩大全球业务范围,正式进军新西兰市场
- 理解操作系统的sleep函数
- PWM输入捕获(只使用一路定时器通道)