Update: 更新WebSocket模式
This commit is contained in:
王立帮
@@ -1,294 +1,25 @@
|
||||
goog.loadJs('web', () => {
|
||||
|
||||
goog.require('path');
|
||||
goog.require('Mixly.Env');
|
||||
goog.require('Mixly.Config');
|
||||
goog.require('Mixly.Boards');
|
||||
goog.require('Mixly.Command');
|
||||
goog.require('Mixly.MJSON');
|
||||
goog.require('Mixly.MArray');
|
||||
goog.require('Mixly.LayerExt');
|
||||
goog.require('io');
|
||||
goog.require('Mixly.WebSocket');
|
||||
goog.require('Mixly.WebSocket.Serial');
|
||||
goog.require('Mixly.WebSocket.ArduShell');
|
||||
goog.provide('Mixly.WebSocket.Socket');
|
||||
|
||||
const {
|
||||
Env,
|
||||
Config,
|
||||
Boards,
|
||||
Command,
|
||||
MJSON,
|
||||
MArray,
|
||||
LayerExt
|
||||
} = Mixly;
|
||||
const { WebSocket } = Mixly;
|
||||
const { Socket, Serial, ArduShell } = WebSocket;
|
||||
|
||||
const { BOARD, SELECTED_BOARD, SOFTWARE } = Config;
|
||||
|
||||
const { Socket } = Mixly.WebSocket;
|
||||
|
||||
Socket.obj = null;
|
||||
Socket.url = 'ws://127.0.0.1/socket';
|
||||
Socket.jsonArr = [];
|
||||
Socket.connected = false;
|
||||
Socket.initFunc = null;
|
||||
Socket.debug = SOFTWARE.debug;
|
||||
BOARD.server = { ...SOFTWARE.webSocket };
|
||||
let { hostname, protocol, port } = window.location;
|
||||
if (protocol === 'http:') {
|
||||
Socket.protocol = 'ws:';
|
||||
} else {
|
||||
Socket.protocol = 'wss:';
|
||||
}
|
||||
if (port) {
|
||||
port = ':' + port;
|
||||
}
|
||||
Socket.url = Socket.protocol + '//' + hostname + port + '/socket';
|
||||
Socket.IPAddress = hostname;
|
||||
|
||||
let lockReconnect = false; //避免重复连接
|
||||
let timeoutFlag = true;
|
||||
let timeoutSet = null;
|
||||
let reconectNum = 0;
|
||||
const timeout = 5000; //超时重连间隔
|
||||
|
||||
function reconnect () {
|
||||
if (lockReconnect) return;
|
||||
lockReconnect = true;
|
||||
//没连接上会一直重连，设置延迟避免请求过多
|
||||
setTimeout(function () {
|
||||
timeoutFlag = true;
|
||||
Socket.init();
|
||||
console.info(`正在重连第${reconectNum + 1}次`);
|
||||
reconectNum++;
|
||||
lockReconnect = false;
|
||||
}, timeout); //这里设置重连间隔(ms)
|
||||
}
|
||||
|
||||
//心跳检测
|
||||
const heartCheck = {
|
||||
timeout, //毫秒
|
||||
timeoutObj: null,
|
||||
serverTimeoutObj: null,
|
||||
reset: function () {
|
||||
clearInterval(this.timeoutObj);
|
||||
clearTimeout(this.serverTimeoutObj);
|
||||
return this;
|
||||
},
|
||||
start: function () {
|
||||
const self = this;
|
||||
let count = 0;
|
||||
let WS = Socket;
|
||||
this.timeoutObj = setInterval(() => {
|
||||
if (count < 3) {
|
||||
if (WS.obj.readyState === 1) {
|
||||
WS.obj.send('HeartBeat');
|
||||
console.info(`HeartBeat第${count + 1}次`);
|
||||
}
|
||||
count++;
|
||||
} else {
|
||||
clearInterval(this.timeoutObj);
|
||||
count = 0;
|
||||
if (WS.obj.readyState === 0 && WS.obj.readyState === 1) {
|
||||
WS.obj.close();
|
||||
}
|
||||
}
|
||||
}, self.timeout);
|
||||
}
|
||||
}
|
||||
|
||||
Socket.init = (onopenFunc = (data) => {}, doFunc = () => {}) => {
|
||||
if (Socket.connected) {
|
||||
if (Socket.initFunc) {
|
||||
Socket.initFunc();
|
||||
Socket.initFunc = null;
|
||||
}
|
||||
doFunc();
|
||||
return;
|
||||
}
|
||||
|
||||
timeoutSet = setTimeout(() => {
|
||||
if (timeoutFlag && reconectNum < 3) {
|
||||
console.info(`重连`);
|
||||
reconectNum++;
|
||||
Socket.init();
|
||||
}
|
||||
}, timeout);
|
||||
|
||||
let WS = Socket;
|
||||
WS.obj = new WebSocket(WS.url);
|
||||
WS.obj.onopen = () => {
|
||||
const { mainStatusBarTabs } = Mixly;
|
||||
const statusBarTerminal = mainStatusBarTabs.getStatusBarById('output');
|
||||
console.log('已连接' + WS.url);
|
||||
mainStatusBarTabs.show();
|
||||
mainStatusBarTabs.changeTo('output');
|
||||
statusBarTerminal.setValue(WS.url + '连接成功\n');
|
||||
WS.connected = true;
|
||||
Socket.toggleUIToolbar(true);
|
||||
Socket.initFunc = doFunc;
|
||||
reconectNum = 0;
|
||||
timeoutFlag = false;
|
||||
clearTimeout(timeoutSet);
|
||||
heartCheck.reset().start();
|
||||
onopenFunc(WS);
|
||||
};
|
||||
|
||||
WS.obj.onmessage = (event) => {
|
||||
heartCheck.reset().start();
|
||||
let command = Command.parse(event.data);
|
||||
command = MJSON.decode(command);
|
||||
if (Socket.debug)
|
||||
console.log('receive -> ', event.data);
|
||||
/*if (command && command.obj && command.function) {
|
||||
if (command.type === 1) {
|
||||
let args = command.args ?? [];
|
||||
try {
|
||||
if (window[command.obj][command.function])
|
||||
window[command.obj][command.function](...args);
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
}*/
|
||||
Command.run(command);
|
||||
};
|
||||
|
||||
WS.obj.onerror = (event) => {
|
||||
console.log('WebSocket error: ', event);
|
||||
reconnect(); //重连
|
||||
};
|
||||
|
||||
WS.obj.onclose = (event) => {
|
||||
const { mainStatusBarTabs } = Mixly;
|
||||
const statusBarTerminal = mainStatusBarTabs.getStatusBarById('output');
|
||||
WS.connected = false;
|
||||
console.log('已断开' + WS.url);
|
||||
mainStatusBarTabs.show();
|
||||
mainStatusBarTabs.changeTo('output');
|
||||
statusBarTerminal.setValue(WS.url + '连接断开，请在设置中重新连接\n');
|
||||
let ports = [ ...mainStatusBarTabs.statusBarIndexToIds ];
|
||||
MArray.remove(ports, 'output');
|
||||
for (let i = 0; i < ports.length; i++) {
|
||||
const statusBarSerial = mainStatusBarTabs.getStatusBarById(ports[i]);
|
||||
statusBarSerial.close(ports[i]);
|
||||
}
|
||||
Socket.toggleUIToolbar(false);
|
||||
layer.closeAll();
|
||||
Mixly.WebSocket.BU.burning = false;
|
||||
Mixly.WebSocket.BU.uploading = false;
|
||||
Mixly.WebSocket.ArduShell.compiling = false;
|
||||
Mixly.WebSocket.ArduShell.uploading = false;
|
||||
|
||||
console.info(`关闭`, event.code);
|
||||
if (event.code !== 1000) {
|
||||
timeoutFlag = false;
|
||||
clearTimeout(timeoutSet);
|
||||
reconnect();
|
||||
} else {
|
||||
clearInterval(heartCheck.timeoutObj);
|
||||
clearTimeout(heartCheck.serverTimeoutObj);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Socket.sendCommand = (command) => {
|
||||
let WS = Mixly.WebSocket.Socket;
|
||||
if (!WS.connected) {
|
||||
layer.msg('未连接' + WS.url, {time: 1000});
|
||||
return;
|
||||
}
|
||||
let commandStr = '';
|
||||
|
||||
try {
|
||||
commandStr = JSON.stringify(MJSON.encode(command));
|
||||
if (Socket.debug)
|
||||
console.log('send -> ', commandStr);
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
return;
|
||||
}
|
||||
WS.obj.send(commandStr);
|
||||
}
|
||||
|
||||
Socket.clickConnect = () => {
|
||||
if (Socket.connected) {
|
||||
Socket.disconnect();
|
||||
} else {
|
||||
Socket.connect((WS) => {
|
||||
layer.closeAll();
|
||||
layer.msg(WS.url + '连接成功', { time: 1000 });
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Socket.openLoadingBox = (title, successFunc = () => {}, endFunc = () => {}) => {
|
||||
layer.open({
|
||||
type: 1,
|
||||
title: title,
|
||||
content: $('#mixly-loader-div'),
|
||||
shade: LayerExt.SHADE_ALL,
|
||||
closeBtn: 0,
|
||||
success: function () {
|
||||
$("#webusb-cancel").css("display","none");
|
||||
$(".layui-layer-page").css("z-index", "198910151");
|
||||
successFunc();
|
||||
},
|
||||
end: function () {
|
||||
$("#mixly-loader-div").css("display", "none");
|
||||
$(".layui-layer-shade").remove();
|
||||
$("#webusb-cancel").css("display", "unset");
|
||||
if (Socket.connected)
|
||||
endFunc();
|
||||
}
|
||||
Socket.init = function () {
|
||||
const socket = io('wss://127.0.0.1:4000', {
|
||||
path: '/mixly-socket/',
|
||||
reconnectionDelayMax: 10000,
|
||||
transports: ['websocket'],
|
||||
protocols: ['my-protocol-v1']
|
||||
});
|
||||
}
|
||||
|
||||
Socket.connect = (onopenFunc = (data) => {}, doFunc = () => {}) => {
|
||||
if (Socket.connected) {
|
||||
doFunc();
|
||||
return;
|
||||
}
|
||||
let title = '连接中...';
|
||||
Socket.openLoadingBox(title, () => {
|
||||
setTimeout(() => {
|
||||
Socket.init(onopenFunc);
|
||||
}, 1000);
|
||||
}, doFunc);
|
||||
}
|
||||
|
||||
Socket.disconnect = () => {
|
||||
if (!Socket.connected)
|
||||
return;
|
||||
let title = '断开中...';
|
||||
Socket.openLoadingBox(title, () => {
|
||||
Socket.obj.close();
|
||||
});
|
||||
}
|
||||
|
||||
Socket.toggleUIToolbar = (connected) => {
|
||||
try {
|
||||
if (connected) {
|
||||
$('#socket-connect-btn').html(Blockly.Msg.MSG['disconnect']);
|
||||
$('#socket-connect-btn').removeClass('icon-link').addClass('icon-unlink');
|
||||
} else {
|
||||
$('#socket-connect-btn').html(Blockly.Msg.MSG['connect']);
|
||||
$('#socket-connect-btn').removeClass('icon-unlink').addClass('icon-link');
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
|
||||
Socket.updateSelectedBoardConfig = (info) => {
|
||||
Env.currentPlatform = info.currentPlatform;
|
||||
info.clientPath = info.clientPath.replaceAll('\\', '/');
|
||||
Env.clientPath = info.clientPath;
|
||||
info.appPath = info.appPath.replaceAll('\\', '/');
|
||||
Env.srcDirPath = info.appPath;
|
||||
Env.indexDirPath = path.join(Env.srcDirPath, 'boards');
|
||||
Env.boardDirPath = path.join(Env.srcDirPath, BOARD.boardIndex, '../');
|
||||
Env.python3Path = info.python3Path;
|
||||
const boardType = Boards.getSelectedBoardName();
|
||||
Boards.changeTo(boardType);
|
||||
Serial.init(socket);
|
||||
ArduShell.init(socket);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user