update websocket reconnect policy & fix some bugs
This commit is contained in:
lb
parent
6b838ce089
commit
0f56538c27
@ -94,7 +94,7 @@ function getOptions(showChart, hisState, runState) {
|
||||
.fill(1)
|
||||
.map((_, index) => {
|
||||
const today = new Date();
|
||||
const dtimestamp = today - index * 24 * 60 * 60 * 1000;
|
||||
const dtimestamp = today - (index + 1) * 24 * 60 * 60 * 1000;
|
||||
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
||||
dtimestamp
|
||||
).getDate()}`;
|
||||
|
||||
@ -36,7 +36,7 @@ export default function getOptions(seriesData, name) {
|
||||
.fill(1)
|
||||
.map((_, index) => {
|
||||
const today = new Date();
|
||||
const dtimestamp = today - index * 24 * 60 * 60 * 1000;
|
||||
const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
|
||||
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
||||
dtimestamp
|
||||
).getDate()}`;
|
||||
|
||||
@ -133,7 +133,7 @@ function getOptions(source, period, trend) {
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
name: "单位m³/h",
|
||||
name: source == 'O2_float' ? "单位:%" : "单位mg/m³",
|
||||
nameTextStyle: {
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
|
||||
@ -12,16 +12,16 @@ function SmokeHandle(props) {
|
||||
<div className={`${cls.smokeHandle__content} flex flex-col`}>
|
||||
<div className={cls.info__item_groups}>
|
||||
<div className={cls.info__item}>
|
||||
氧 气 含 量 : {smokeInfo?.O2_float || 0}%
|
||||
氧 气 含 量 : {smokeInfo?.O2_float?.toFixed(2) || 0}%
|
||||
</div>
|
||||
<div className={cls.info__item}>
|
||||
氮氧化物浓度: {smokeInfo?.NOX_float || 0}mg/m³
|
||||
氮氧化物浓度: {smokeInfo?.NOX_float?.toFixed(2) || 0}mg/m³
|
||||
</div>
|
||||
<div className={cls.info__item}>
|
||||
二氧化硫浓度: {smokeInfo?.SO2_float || 0}mg/m³
|
||||
二氧化硫浓度: {smokeInfo?.SO2_float?.toFixed(2) || 0}mg/m³
|
||||
</div>
|
||||
<div className={cls.info__item}>
|
||||
颗粒物浓度: {smokeInfo?.dust_float || 0}mg/m³
|
||||
颗粒物浓度: {smokeInfo?.dust_float?.toFixed(2) || 0}mg/m³
|
||||
</div>
|
||||
</div>
|
||||
<TechSplitline />
|
||||
|
||||
@ -115,7 +115,7 @@ function getOptions(period, trend) {
|
||||
.fill(1)
|
||||
.map((_, index) => {
|
||||
if (period == "week") {
|
||||
const dtimestamp = today - index * 24 * 60 * 60 * 1000;
|
||||
const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
|
||||
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
||||
dtimestamp
|
||||
).getDate()}`;
|
||||
|
||||
@ -114,7 +114,7 @@ function getOptions(period, trend) {
|
||||
.fill(1)
|
||||
.map((_, index) => {
|
||||
if (period == "week") {
|
||||
const dtimestamp = today - index * 24 * 60 * 60 * 1000;
|
||||
const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
|
||||
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
||||
dtimestamp
|
||||
).getDate()}`;
|
||||
|
||||
@ -40,7 +40,7 @@ export function getOptions(period, source, trend, options={}) {
|
||||
.fill(1)
|
||||
.map((_, index) => {
|
||||
if (period == "week") {
|
||||
const dtimestamp = today - index * 24 * 60 * 60 * 1000;
|
||||
const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
|
||||
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
||||
dtimestamp
|
||||
).getDate()}`;
|
||||
@ -65,7 +65,7 @@ export function getOptions(period, source, trend, options={}) {
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
name: "单位/m³",
|
||||
name: source == 'elec' ? '单位/kWh' : "单位/Nm³",
|
||||
nameTextStyle: {
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
|
||||
@ -12,69 +12,153 @@ class XClient {
|
||||
url: string;
|
||||
name: string;
|
||||
ws: WebSocket;
|
||||
timeout: number = 1000 * 5;
|
||||
reconnectCount: number = 0;
|
||||
onmessage: (msg: MessageEvent) => void;
|
||||
hb: number = 0;
|
||||
|
||||
constructor(
|
||||
url: string,
|
||||
name: string,
|
||||
config: {
|
||||
url: string;
|
||||
name: string;
|
||||
timeout?: number;
|
||||
reconnectCount?: number;
|
||||
},
|
||||
onmessage: (msg: MessageEvent) => void
|
||||
) {
|
||||
this.url = url;
|
||||
this.name = name;
|
||||
this.ws = new WebSocket(url);
|
||||
this.url = config.url;
|
||||
this.name = config.name;
|
||||
this.ws = new WebSocket(config.url);
|
||||
this.timeout = config.timeout || 1000 * 5;
|
||||
|
||||
this.ws.onopen = () => {
|
||||
// console.log(`[*] ${this.name} ws connected`);
|
||||
console.log(`[*] ${this.name} 初始化连接成功`);
|
||||
this.hb = this.heartbeat();
|
||||
};
|
||||
this.onmessage = onmessage;
|
||||
this.ws.onmessage = onmessage;
|
||||
this.ws.onerror = (err) => {
|
||||
console.log("[*] websocket error!", err);
|
||||
console.log(`[*] ${this.name} 连接错误`, err);
|
||||
this.tryReconnect();
|
||||
};
|
||||
this.ws.onclose = (e) => {
|
||||
console.log(`[*] ${this.name} ws closed`);
|
||||
console.log(`[*] ${this.name} 连接关闭`);
|
||||
};
|
||||
}
|
||||
|
||||
heartbeat() {
|
||||
if (this.hb) clearInterval(this.hb);
|
||||
return setInterval(() => {
|
||||
console.log(`${this.name} ping...`);
|
||||
if (this.ws.readyState == WebSocket.OPEN) {
|
||||
this.ws.send("ping");
|
||||
} else {
|
||||
clearInterval(this.hb);
|
||||
this.tryReconnect();
|
||||
}
|
||||
}, 1000 * 1);
|
||||
}
|
||||
|
||||
tryReconnect() {
|
||||
console.log(`[*] ${this.name} 重连中，已尝试:`, this.reconnectCount, "次");
|
||||
setTimeout(
|
||||
() => {
|
||||
if (this.ws.readyState === WebSocket.OPEN) {
|
||||
this.reconnectCount = 0;
|
||||
console.log(`[*] ${this.name} 已恢复连接，取消重连`);
|
||||
return;
|
||||
}
|
||||
this.reconnectCount++;
|
||||
this.ws = new WebSocket(this.url);
|
||||
this.ws.onopen = () => {
|
||||
console.log(`[*] ${this.name} 重连成功`);
|
||||
this.reconnectCount = 0;
|
||||
this.hb = this.heartbeat();
|
||||
};
|
||||
this.ws.onmessage = this.onmessage;
|
||||
this.ws.onerror = (err) => {
|
||||
console.log(`[*] ${this.name} 重连出错`);
|
||||
this.tryReconnect();
|
||||
};
|
||||
this.ws.onclose = (e) => {
|
||||
console.log(`[*] ${this.name} 重连连接关闭`);
|
||||
};
|
||||
},
|
||||
this.reconnectCount == 0 ? 0 : this.timeout
|
||||
);
|
||||
}
|
||||
|
||||
logStatus() {
|
||||
console.log(
|
||||
`[*] ${this.name} 重连状态: 连接中`,
|
||||
this.ws.readyState == WebSocket.CONNECTING
|
||||
);
|
||||
console.log(
|
||||
`[*] ${this.name} 重连状态: 已连接`,
|
||||
this.ws.readyState == WebSocket.OPEN
|
||||
);
|
||||
console.log(
|
||||
`[*] ${this.name} 重连状态: 关闭中`,
|
||||
this.ws.readyState == WebSocket.CLOSING
|
||||
);
|
||||
console.log(
|
||||
`[*] ${this.name} 重连状态: 关闭`,
|
||||
this.ws.readyState == WebSocket.CLOSED
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const newUser = uuidv4();
|
||||
new XClient(
|
||||
// "ws://m306416y13.yicp.fun:35441/xc-screen/websocket/xc001",
|
||||
// "ws://192.168.1.114:8081/xc-screen/websocket/xc001",
|
||||
"ws://10.70.180.10:8081/xc-screen/websocket/xc001",
|
||||
// "ws://192.168.1.12:8081/xc-screen/websocket/xc001",
|
||||
"DCS_DATA",
|
||||
{
|
||||
url: "ws://10.70.180.10:8081/xc-screen/websocket/xc001" + newUser,
|
||||
name: "DCS_DATA",
|
||||
// "ws://m306416y13.yicp.fun:35441/xc-screen/websocket/xc001",
|
||||
// "ws://192.168.1.114:8081/xc-screen/websocket/xc001",
|
||||
// "ws://192.168.1.12:8081/xc-screen/websocket/xc001",
|
||||
},
|
||||
dcsHandler
|
||||
);
|
||||
|
||||
const newUser = uuidv4();
|
||||
new XClient(
|
||||
// "ws://192.168.1.74:48080/websocket/message?userId=ENERGY" + newUser,
|
||||
"ws://10.70.2.2:8080/websocket/message?userId=ENERGY" + newUser,
|
||||
// "ws://192.168.1.74:48080/websocket/message?userId=ENERGY111",
|
||||
"MES_DATA",
|
||||
{
|
||||
url: "ws://10.70.2.2:8080/websocket/message?userId=ENERGY" + newUser,
|
||||
name: "MES_DATA",
|
||||
// "ws://192.168.1.74:48080/websocket/message?userId=ENERGY" + newUser,
|
||||
// "ws://192.168.1.74:48080/websocket/message?userId=ENERGY111",
|
||||
},
|
||||
energeHandler
|
||||
);
|
||||
|
||||
// 产线缺陷相关数据
|
||||
new XClient(
|
||||
"ws://10.70.2.2:8080/websocket/message?userId=IS" + newUser,
|
||||
// "ws://192.168.0.33:48082/websocket/message?userId=IS111",
|
||||
"QUALITY_DATA",
|
||||
{
|
||||
url: "ws://10.70.2.2:8080/websocket/message?userId=IS" + newUser,
|
||||
name: "QUALITY_DATA",
|
||||
// "ws://192.168.0.33:48082/websocket/message?userId=IS111",
|
||||
},
|
||||
IsHandler
|
||||
);
|
||||
|
||||
// 良品率相关数据
|
||||
new XClient(
|
||||
// "ws://10.70.27.122:8080/websocket/message?userId=CUTTING",
|
||||
"ws://10.70.2.2:8080/websocket/message?userId=CUTTING" + newUser,
|
||||
// "ws://192.168.0.33:48082/websocket/message?userId=CUTTING" + newUser,
|
||||
"CUTTING_DATA",
|
||||
{
|
||||
url: "ws://10.70.2.2:8080/websocket/message?userId=CUTTING" + newUser,
|
||||
name: "CUTTING_DATA",
|
||||
// "ws://10.70.27.122:8080/websocket/message?userId=CUTTING",
|
||||
// "ws://192.168.0.33:48082/websocket/message?userId=CUTTING" + newUser,
|
||||
},
|
||||
cuttingHandler
|
||||
);
|
||||
|
||||
// 烟气处理相关数据
|
||||
new XClient(
|
||||
// "ws://10.70.27.122:8080/websocket/message?userId=CUTTING",
|
||||
"ws://10.70.2.2:8080/websocket/message?userId=GAS" + newUser,
|
||||
// "ws://192.168.1.62:48082/websocket/message?userId=GAS" + newUser,
|
||||
"SMOKE_DATA",
|
||||
{
|
||||
url: "ws://10.70.2.2:8080/websocket/message?userId=GAS" + newUser,
|
||||
name: "SMOKE_DATA",
|
||||
// "ws://10.70.27.122:8080/websocket/message?userId=CUTTING",
|
||||
// "ws://192.168.1.62:48082/websocket/message?userId=GAS" + newUser,
|
||||
},
|
||||
smokeHandler
|
||||
);
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user