如何使用GoEasy实现PHP与Websocket实时通信
最近搞了搞websocket 做了个简答的聊天demo
1. 从GoEasy获取appkey
appkey是验证用户的有效性的唯一标识。
Ø 注册账号。 GoEasy官网:https://goeasy.io
Ø 用注册好的账号登录到GoEasy的后台管理系统,创建您自己应用(application).
Ø Application创建好之后系统会自动为您生成appkey
系统会生成两个keys,一个Super key和一个Subscribe key;它们的区别在于前者既可以订阅又可以推送,但后者只能用于订阅。
2. GoEasy实现向特定用户群推送的原理
知道了他们的推送原理,可以更加方便我们了解他们的服务,以及理解我们写的代码。其实原理很简单,只需要确定哪些用户需要接收信息,然后让这些用户都订阅一个相同的channel(频道)。然后再往这个平台上推送消息即可!所有关键在于channel,channel一致,则可以接收到信息,否则收不到!
对于订阅必须要的信息有:Appkey, channel
对于推送必须要的信息有:Appkey, channel, content
3. 用GoEasy实现订阅(接收)的实例
实现步骤:
1. 引入goeasy.js
2. 创建goeasy实例/对象
3. 用subscribe 函数进行订阅,然后在回调函数里接收信息即可
<script type="text/javascript"src="https://cdn.goeasy.io/goeasy.js"></script>
<script type="text/javascript">
var goEasy = new GoEasy({appkey: 'your appkey'});
goEasy.subscribe({
channel: 'your_channel',
onMessage: function(message){
alert('接收到消息:'+message.content);//拿到了信息之后,你可以做你任何想做的事
}
});
</script>
有了这几行代码后,只要保证网络畅通的情况下,页面会自动弹出你从任何平台上推送的信息。
4. 用GoEasy实现推送及接收的实例
目前GoEasy支持三种推送方式:Java后台推送(它们有提供JAVA SDK和 maven远程仓库), JS推送,RestAPI推送(有了RestAPI,我们就可以用PHP, .NET, Ruby…来推送信息了,很方便)
说了这么多,上代码,
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
/*这里引入就不说了*/
<script type="text/javascript" src="https://cdn-hangzhou.goeasy.io/goeasy.js"></script>
<script type="text/javascript">
var goEasy = new GoEasy({
appkey: 'BC-2a8038ce95db44a4b566c434f73b57f8'
});
//按回车键发送消息
document.onkeydown=function(event){
var e = event || window.event ;
if(e && e.keyCode==13){ // enter 键
if(document.getElementById("txt").value != ''){
pub();
}
}
};
//消息发送
function pub (){
//获取值不说了
var vues = document.getElementById("txt").value
//内容追加
var s = "<p class='pa'> "+vues+":——my</p>";
document.getElementById("con").innerHTML += s
//z重点来了 这里是消息推送
goEasy.publish({
//标识 也可以说是自己的唯一标识
channel: 'bianchao2',
//消息内容
message: vues
});
//发送完清空文本框
document.getElementById("txt").value=''
//聊天框滚动条自动滚到底部显示最新信息
document.getElementById("con").scrollTop =document.getElementById("con").scrollHeight
}
//接收信息
goEasy.subscribe({
//对方的标识
channel: 'bianchao',
onMessage: function(message){
//alert('收到:'+message.content);
var s = "<p class='pb'> 他——:"+message.content+"</p>";
//同理 追加内容
document.getElementById("con").innerHTML += s
//聊天框滚动条自动滚到底部显示最新信息
document.getElementById("con").scrollTop =document.getElementById("con").scrollHeight
}
});
//GoEasy-OTP可以对appkey进行有效保护,详情请参考:GoEasy-Reference
</script>
<style type="text/css">
#con{
width: 15rem;
height: 30rem;
border: 1px solid #000;
overflow-y:scroll;
}
.pa{
width: 100%;
color:red;
text-align: right;
}
.pb{
width: 100%;
color:green;
text-align: left;
}
</style>
</head>
<body>
<div id="con">
</div>
<input type="text" id="txt" >
<button onclick="pub();">推送</button>
<table>
<tr>
<td>
</td>
</tr></table>
</body>
</html>
至此 一个简单的基于goeasy的 websocket 聊天室 就实现了 有不好的地方 欢迎指教
大家也可以自己完善一些功能。