|
|
// 在Vue中使用，不需要可以去除以下引用
|
|
|
import Vue, {ComponentOptions as h} from 'vue'
|
|
|
import axios from "axios";
|
|
|
// import storage from 'store'
|
|
|
import storage from "./store/index";
|
|
|
import "./element";
|
|
|
// 导出socket对象
|
|
|
|
|
|
export {
|
|
|
socket
|
|
|
}
|
|
|
|
|
|
// socket主要对象
|
|
|
var socket = {
|
|
|
websock: null,
|
|
|
// 固定的WebSocket地址：此处是从env文件中读取socket地址，可以自行从其他config文件中读取或直接写死
|
|
|
// 如需使用动态WebSocket地址，请自行作ajax通讯后扩展
|
|
|
// ws_url: "ws://127.0.0.1:9991/api/websocket/100",
|
|
|
// 开启标识
|
|
|
socket_open: false,
|
|
|
// 心跳timer
|
|
|
hearbeat_timer: null,
|
|
|
// 心跳发送频率
|
|
|
hearbeat_interval: 5000,
|
|
|
ws_url:null,
|
|
|
// 是否自动重连
|
|
|
is_reonnect: true,
|
|
|
// 重连次数
|
|
|
reconnect_count: 3,
|
|
|
// 已发起重连次数
|
|
|
reconnect_current: 1,
|
|
|
// 重连timer
|
|
|
reconnect_timer: null,
|
|
|
// 重连频率
|
|
|
reconnect_interval: 3000,
|
|
|
myVue:{},
|
|
|
|
|
|
/**
|
|
|
* 初始化连接
|
|
|
*/
|
|
|
init: (data) => {
|
|
|
axios.get("./config.json").then(res => {
|
|
|
// 基础地址
|
|
|
socket.ws_url = res.data.WEBSOCKET_URL;
|
|
|
console.log(res.data.BASE_URL + "\n" + res.data.WEBSOCKET_URL);
|
|
|
socket.initData(data);
|
|
|
});
|
|
|
},
|
|
|
|
|
|
initData: (data) => {
|
|
|
|
|
|
console.log(data);
|
|
|
socket.myVue = data;
|
|
|
if (!("WebSocket" in window)) {
|
|
|
console.log('浏览器不支持WebSocket')
|
|
|
return null
|
|
|
}
|
|
|
|
|
|
// 已经创建过连接不再重复创建
|
|
|
if (socket.websock) {
|
|
|
return socket.websock
|
|
|
}
|
|
|
|
|
|
socket.websock = new WebSocket(socket.ws_url+"/100")
|
|
|
socket.websock.onmessage = function (e) {
|
|
|
socket.receive(e)
|
|
|
}
|
|
|
|
|
|
// 关闭连接
|
|
|
socket.websock.onclose = function (e) {
|
|
|
console.log('连接已断开')
|
|
|
console.log('connection closed (' + e.code + ')')
|
|
|
clearInterval(socket.hearbeat_interval)
|
|
|
socket.socket_open = false
|
|
|
|
|
|
// 需要重新连接
|
|
|
if (socket.is_reonnect) {
|
|
|
socket.reconnect_timer = setTimeout(() => {
|
|
|
// 超过重连次数
|
|
|
if (socket.reconnect_current > socket.reconnect_count) {
|
|
|
clearTimeout(socket.reconnect_timer)
|
|
|
return
|
|
|
}
|
|
|
|
|
|
// 记录重连次数
|
|
|
socket.reconnect_current++
|
|
|
socket.reconnect()
|
|
|
}, socket.reconnect_interval)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 连接成功
|
|
|
socket.websock.onopen = function () {
|
|
|
console.log('连接成功')
|
|
|
socket.socket_open = true
|
|
|
socket.is_reonnect = true
|
|
|
// 开启心跳
|
|
|
socket.heartbeat()
|
|
|
}
|
|
|
|
|
|
// 连接发生错误
|
|
|
socket.websock.onerror = function () {
|
|
|
console.log('WebSocket连接发生错误')
|
|
|
}
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 发送消息
|
|
|
* @param {*} data 发送数据
|
|
|
* @param {*} callback 发送后的自定义回调函数
|
|
|
*/
|
|
|
send: (data, callback = null) => {
|
|
|
// 开启状态直接发送
|
|
|
if (socket.websock.readyState === socket.websock.OPEN) {
|
|
|
socket.websock.send(JSON.stringify(data))
|
|
|
|
|
|
if (callback) {
|
|
|
callback()
|
|
|
}
|
|
|
|
|
|
// 正在开启状态，则等待1s后重新调用
|
|
|
} else if (socket.websock.readyState === socket.websock.CONNECTING) {
|
|
|
setTimeout(function () {
|
|
|
socket.send(data, callback)
|
|
|
}, 1000)
|
|
|
|
|
|
// 未开启，则等待1s后重新调用
|
|
|
} else {
|
|
|
socket.init()
|
|
|
setTimeout(function () {
|
|
|
socket.send(data, callback)
|
|
|
}, 1000)
|
|
|
}
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 接收消息
|
|
|
* @param {*} message 接收到的消息
|
|
|
*/
|
|
|
receive: (message) => {
|
|
|
var params = JSON.parse(message.data)
|
|
|
|
|
|
if (params.type != 0) {
|
|
|
console.log('收到服务器内容：', message.data)
|
|
|
}
|
|
|
|
|
|
if (params == undefined) {
|
|
|
console.log("收到服务器空内容")
|
|
|
return false
|
|
|
}
|
|
|
|
|
|
// 以下是接收消息后的业务处理，仅供参考
|
|
|
|
|
|
// 被服务器强制断开
|
|
|
if (params.type != undefined && params.type == 110) {
|
|
|
socket.socket_open = false
|
|
|
socket.is_reonnect = true
|
|
|
|
|
|
// 被服务器踢掉
|
|
|
} else if (params.type == 99) {
|
|
|
socket.socket_open = true
|
|
|
socket.is_reonnect = false
|
|
|
console.log("被挤下线 不做处理")
|
|
|
return false
|
|
|
} else if (params.type == 'sid') {
|
|
|
socket.myVue.$notify.success({
|
|
|
title: '提示',
|
|
|
message: params.data
|
|
|
});
|
|
|
}else if(params.type == 'err'){
|
|
|
socket.myVue.$notify.error({
|
|
|
title: '提示',
|
|
|
message: params.data
|
|
|
});
|
|
|
}
|
|
|
|
|
|
// 自行扩展其他业务处理...
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 心跳
|
|
|
*/
|
|
|
heartbeat: () => {
|
|
|
console.log('socket', 'ping')
|
|
|
if (socket.hearbeat_timer) {
|
|
|
clearInterval(socket.hearbeat_timer)
|
|
|
}
|
|
|
|
|
|
socket.hearbeat_timer = setInterval(() => {
|
|
|
const token = storage.get('Access-Token')
|
|
|
var data = {
|
|
|
type: 0, //请求类型 type 0 心跳包
|
|
|
shop_id: Vue.prototype.$shop_id(false), //如果是商家 传当前店铺ID 否则可不传
|
|
|
'API-Token': token, //用户的token
|
|
|
'API-Source': 'MERCHANT', // MERCHANT 商家 CUSTOMER 顾客
|
|
|
}
|
|
|
socket.send(data)
|
|
|
}, socket.hearbeat_interval)
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 主动关闭连接
|
|
|
*/
|
|
|
close: () => {
|
|
|
console.log('主动断开连接')
|
|
|
clearInterval(socket.hearbeat_interval)
|
|
|
socket.is_reonnect = false
|
|
|
socket.websock.close()
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 重新连接
|
|
|
*/
|
|
|
reconnect: () => {
|
|
|
console.log('发起重新连接', socket.reconnect_current)
|
|
|
|
|
|
if (socket.websock && socket.socket_open) {
|
|
|
socket.websock.close()
|
|
|
}
|
|
|
|
|
|
socket.init()
|
|
|
},
|
|
|
}
|
