本文主要是介绍php lumen 聊天室,laravel5.4实现实时聊天室，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
一、修改laravel的广播驱动
修改 .env中：
BROADCAST_DRIVER=redis
二、创建laravel事件广播
比如要创建一个发送聊天消息的事件，则
php artisan make:event SendChat
后在app/events里面会有SendChat.php
SendChat.php：
//由于该事件需要广播，则该类需要实现ShouldBroadcast
Class SendChat implements ShouldBroadcast {
//然后将需要广播的数据以public形式写在此类作为成员属性
public $input;
//new对象时存入的数据
public function __construct($input) {
$this->input = $input;
}
public function broadcastOn() {
//公共channel
return ['test-channel'];
}
}
最后将会得到如下数据：
频道：test-channel
数据：{"event":"App\Events\UserSignUp","data":{"input":"xulibin","socket":null},"socket":null}
Redis版本：
若不用laravel 的broadcast，则可以用Redis(它也有发布和订阅功能)
$data = ['event' => 'SendChat','data' => ['input' => 'xlb'] ];
Redis::publish('test-channel',json_encode($data));
最后将会得到如下数据：
频道：test-channel
数据：{"event":"SendChat","data":{"input":"xlb"}}
三、创建node服务器，接受laravel事件广播，再转广播给前端client，此处Node服务器是占用了3000端口，待会client也要监听这个3000端口。
1、另外还需要引入socket.io和ioredis
npm install socket.io ioredis --save
2、创建socket.js(这次是创建在项目根目录，也可其他目录)
var server = require('http').Server();
var io = require('socket.io')(server);
var Redis = require('ioredis');
var redis = new Redis();
redis.subscribe('test-channel');
redis.on('message',function(channel,message){
message = JSON.parse(message);
console.log(channel+':'+message.event);
//这里是以“频道:事件”的方式去发送，需要接受此事件的client就接受此格式的事件
//test-channel:SendChat
io.emit(channel+':'+message.event,message.data);
});
server.listen(3000);
然后一定要开启node服务器
node socket.js //(如果js位置不同，也要加上前面的目录)
四、Client
引入vue.js(非必要)，socket.is.js,vue-resource(非必要)
New Users:
- @{{chat}}
提交
//监听服务器的3000端口
var socket = io('http://192.168.10.10:3000');
new Vue({
el:'#container',
data:{
users:[],
chatInput:'',
submitUrl: 'http://localhost:8000/api/submit' ,
chatList:[]
},
mounted:function(){
//socket.on('test-channel:UserSignUp',function(data){
socket.on('test-channel:App\\Events\\UserSignUp',function(data){
console.log(data);
this.chatList.push(data.input);
}.bind(this));
},
methods:{
submit(){
var that = this;
that.$http.post(
this.submitUrl,
{'input':this.chatInput}
).then(function(response){ //接口返回数据
},function(error){
})
}
}
});
然后该按钮提交后，服务端的代码如下
$input = $request->input('input');
//触发发送聊天信息事件
event(new SendChat($input));
return $input;
五、流程图
图片1.png
这篇关于php lumen 聊天室,laravel5.4实现实时聊天室的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
