php swoole 项目实战,Laravel 中使用 swoole 项目实战开发案例一 (建立 swoole 和前端通信)...

swoole测试

这是一个测试

var ws;//websocket实例

var lockReconnect = false;//避免重复连接

var wsUrl = ‘ws://{{$_SERVER["HTTP_HOST"]}}:9502?page=home&token=123456‘;

function initEventHandle() {

ws.onclose=function () {

reconnect(wsUrl);

};

ws.οnerrοr=function () {

reconnect(wsUrl);

};

ws.onopen=function () {//心跳检测重置

heartCheck.reset().start();

};

ws.onmessage= function (event) {//如果获取到消息，心跳检测重置//拿到任何消息都说明当前连接是正常的

var data = JSON.parse(event.data);

heartCheck.reset().start();

}

}

createWebSocket(wsUrl);/**

* 创建链接

* @param url*/function createWebSocket(url) {try{

ws= newWebSocket(url);

initEventHandle();

}catch(e) {

reconnect(url);

}

}

function reconnect(url) {if(lockReconnect) return;

lockReconnect= true;//没连接上会一直重连，设置延迟避免请求过多

setTimeout(function () {

createWebSocket(url);

lockReconnect= false;

},2000);

}//心跳检测

var heartCheck ={

timeout:60000,//60秒

timeoutObj: null,

serverTimeoutObj:null,

reset: function(){

clearTimeout(this.timeoutObj);

clearTimeout(this.serverTimeoutObj);return this;

},

start: function(){var self = this;this.timeoutObj =setTimeout(function(){//这里发送一个心跳，后端收到后，返回一个心跳消息，//onmessage拿到返回的心跳就说明连接正常

ws.send("heartbeat");

self.serverTimeoutObj= setTimeout(function(){//如果超过一定时间还没重置，说明后端主动断开了

ws.close();//如果onclose会执行reconnect，我们执行ws.close()就行了.如果直接执行reconnect 会触发onclose导致重连两次

}, self.timeout);

},this.timeout);

},

header:function(url) {

window.location.href=url

}

}

访问前端页面 (显示如下说明前后端链接成功)