简介

        轮训和长连接相关内容可以参考之前的文章消息推送系统。消息推送系统-CSDN博客文章浏览阅读106次。在餐饮行业中，店内应用有pos、厨显屏等，云端应用为对应数据中心。为了实现云端数据和操作指令下发到店内应用，需要有一个系统实现这个功能。https://blog.csdn.net/qq_37011724/article/details/133490117        websocket -> 实时，性能高，会断连丢数据。

        轮训 -> 近实时，性能低，有重试&确认不会丢数据。 

        本文将会通过js 实现轮训 和 websocket 长连接功能。 

轮训功能实现

/*** 定时循环执行某个方法*/
async function loop(func, delayTime) {while (true) {try {func();// block for `delay` millisecondsawait new Promise(resolve => setTimeout(resolve, delayTime));} catch (e) {console.log(e)}}}

websocket功能实现

export const useWebSocketHook = (url) => {// websocket连接状态const [connetState, setConnetState] = useState('disconnected');// 消息列表const [msgBuffer, setMsgBuffer] = useState([]);// 最新消息const [lastMsg, setLastMsg] = useState({});const [ws, setWs] = useState(new WebSocket(url));/*** 创建websocket client*/// 创建websocket连接useEffect(() => {ws.onopen = () => {setConnetState('connected');};ws.onmessage = (e) => {setMsgBuffer([...msgBuffer, e.data]);setLastMsg(e.data);};ws.onclose = () => {setConnetState('disconnected');// websocket 重连setWs(new WebSocket(url))};return () => {ws.close(); // 关闭websocket 连接};}, [ws]);return [connetState, msgBuffer, lastMsg];
}