mirror of https://gitee.com/stylefeng/guns
【message】websocket发送消息
liuhanqing
parent
cadd5fe182
commit
3121440c1b
|
|
@ -16,7 +16,8 @@ layui.define(['jquery', 'layer'], function (exports) {
|
|||
_self.version = "1.0";//版本
|
||||
_self.reCount = param.reCount ? param.reCount : 5;//重连次数
|
||||
_self.lockReconnect = false; //重连标识
|
||||
_self.wsReconnectHandler = null; //重连标识
|
||||
_self.heartCheckHandler = null; //心跳检测
|
||||
_self.wsReconnectHandler = null; //重连处理器
|
||||
var WebSocket = window.WebSocket || window.MozWebSocket || 0;
|
||||
if (!WebSocket) {
|
||||
_self.result = 0;
|
||||
|
|
@ -27,8 +28,9 @@ layui.define(['jquery', 'layer'], function (exports) {
|
|||
|
||||
var func = {};
|
||||
var msgList = [];//等待发送的信息
|
||||
|
||||
// 连接方法
|
||||
_self.connect = function () {
|
||||
debugger
|
||||
try {
|
||||
func.WebSocket = new WebSocket(param.wsUrl);
|
||||
if (func.WebSocket) {
|
||||
|
|
@ -41,8 +43,25 @@ layui.define(['jquery', 'layer'], function (exports) {
|
|||
}
|
||||
}
|
||||
|
||||
_self.reconnect = function (msg) {
|
||||
debugger
|
||||
// 心跳检测
|
||||
_self.heartCheck = function () {
|
||||
// 15s 发送心跳
|
||||
_self.heartCheckHandler && clearTimeout(_self.heartCheckHandler);
|
||||
_self.heartCheckHandler = setTimeout(function () {
|
||||
try {
|
||||
// 发送心跳检测
|
||||
_self.send("&")
|
||||
} catch (e) {
|
||||
(param.connectErr || emptyFun)(e);
|
||||
_self.lockReconnect = false;
|
||||
_self.reconnect()
|
||||
}
|
||||
setTimeout(_self.heartCheck, 15000)
|
||||
}, 15000)
|
||||
}
|
||||
|
||||
// 重新连接方法
|
||||
_self.reconnect = function () {
|
||||
if (_self.lockReconnect || _self.reCount <= 0) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -55,8 +74,9 @@ layui.define(['jquery', 'layer'], function (exports) {
|
|||
_self.lockReconnect = false;
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
// 发送消息方法
|
||||
_self.send = function (msg) {
|
||||
debugger
|
||||
var state = func.WebSocket.readyState;
|
||||
if (state > 1) {
|
||||
console.log("连接已经失败，状态码为：" + state);
|
||||
|
|
@ -69,11 +89,13 @@ layui.define(['jquery', 'layer'], function (exports) {
|
|||
func.WebSocket.send(msg);
|
||||
}
|
||||
if (typeof param.WsSend === 'function') {
|
||||
param.WsSend(msg);
|
||||
param.wsSend(msg);
|
||||
}
|
||||
|
||||
}
|
||||
_self.close = function (a) {
|
||||
|
||||
// 关闭连接方法
|
||||
_self.close = function (event) {
|
||||
try {
|
||||
func.WebSocket.close();
|
||||
} catch (e) {
|
||||
|
|
@ -82,10 +104,12 @@ layui.define(['jquery', 'layer'], function (exports) {
|
|||
|
||||
}
|
||||
|
||||
|
||||
// 绑定ws事件
|
||||
_self.initEventHandle = function () {
|
||||
try {
|
||||
func.WebSocket.onopen = function (event) {
|
||||
_self.reCount = 5;
|
||||
_self.heartCheck();
|
||||
for (var i = 0; i < msgList.length; i++) {
|
||||
func.WebSocket.send(msgList[i]);
|
||||
msgList.shift();
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ layui.use(['element', 'admin', 'HttpRequest', 'func'], function () {
|
|||
var httpRequest = new HttpRequest(Feng.ctxPath + "/sysMessage/allMessageReadFlag", 'get', function (data) {
|
||||
$('#messageClearBtn').parents('.layui-tab-item').addClass('show-empty');
|
||||
$('#msgCount').html(0);
|
||||
$('#messageDot').hide();
|
||||
Feng.success("标记已读成功!");
|
||||
}, function (data) {
|
||||
Feng.error("标记已读失败!" + data.responseJSON.message);
|
||||
|
|
|
|||
|
|
@ -45,13 +45,14 @@
|
|||
|
||||
<script>
|
||||
var wsInst = null
|
||||
layui.use(['layer', 'element', 'admin', 'index', 'HttpRequest', 'ws'], function () {
|
||||
layui.use(['layer', 'element', 'admin', 'index', 'HttpRequest', 'ws', 'notice'], function () {
|
||||
var $ = layui.jquery;
|
||||
var layer = layui.layer;
|
||||
var admin = layui.admin;
|
||||
var index = layui.index;
|
||||
var HttpRequest = layui.HttpRequest;
|
||||
var ws = layui.ws;
|
||||
var notice = layui.notice;
|
||||
|
||||
// 默认加载主页
|
||||
index.loadHome({
|
||||
|
|
@ -82,26 +83,36 @@
|
|||
});
|
||||
wsInst = ws.render({
|
||||
wsUrl: Feng.wsUrl,//WebSocket的地址
|
||||
connectErr: function (a) {
|
||||
console.log(a)
|
||||
connectErr: function (event) {
|
||||
console.log(event)
|
||||
//如果不支持websocket 回调
|
||||
},
|
||||
onWsError: function (a) {
|
||||
onWsError: function (event) {
|
||||
//发生连接错误回调
|
||||
},
|
||||
onWsOpen: function (a) {
|
||||
onWsOpen: function (event) {
|
||||
//连接成功回调
|
||||
console.log("Socket 已打开");
|
||||
wsInst.send("消息发送测试(From Client)");
|
||||
},
|
||||
onWsMessage: function (a) {
|
||||
onWsMessage: function (event) {
|
||||
//服务器发送消息回调
|
||||
let data = event.data;
|
||||
try {
|
||||
let msg = JSON.parse(data)
|
||||
notice.info({
|
||||
title: msg.messageTitle,
|
||||
message: msg.messageContent,
|
||||
timeout: false
|
||||
});
|
||||
$('#messageDot').hide();
|
||||
} catch (e) {}
|
||||
},
|
||||
onWsClose: function (a) {
|
||||
onWsClose: function (event) {
|
||||
//关闭连接回调
|
||||
},
|
||||
|
||||
WsSend: function (a) {
|
||||
wsSend: function (event) {
|
||||
//发送成功后的回调
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -36,7 +36,9 @@
|
|||
<i class="layui-icon layui-icon-notice"></i>
|
||||
<!-- 未读消息气泡提示 -->
|
||||
@if(msgUnReadCount>0){
|
||||
<span class="layui-badge-dot"></span>
|
||||
<span id="messageDot" style="display: block" class="layui-badge-dot"></span>
|
||||
@}else{
|
||||
<span id="messageDot" style="display: none" class="layui-badge-dot"></span>
|
||||
@}
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -39,4 +39,4 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="${ctxPath}/assets/modular/frame/message.js"></script>
|
||||
<script type="text/javascript" src="${ctxPath}/assets/modular/system/index/message.js"></script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue