|
|
|
@ -1,4 +1,4 @@
|
|
|
|
|
import React, { useEffect, useState } from 'react'; |
|
|
|
|
import React, { useEffect, useState, useRef } from 'react'; |
|
|
|
|
import { VscLoading } from 'react-icons/vsc'; |
|
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
|
import { WS_HOST } from '../../configs/constants'; |
|
|
|
@ -9,27 +9,31 @@ const WebsocketClient = () => {
|
|
|
|
|
const reConnectionTime = 5000; //5초
|
|
|
|
|
|
|
|
|
|
const [isConnection, setIsConnection] = useState(false); |
|
|
|
|
const websocket = useRef(null); |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
connect(); |
|
|
|
|
return () => { |
|
|
|
|
websocket.current.close(); |
|
|
|
|
}; |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
const connect = () => { |
|
|
|
|
let websocket = new WebSocket(WS_HOST); |
|
|
|
|
websocket.current = new WebSocket(WS_HOST); |
|
|
|
|
|
|
|
|
|
websocket.onopen = () => { |
|
|
|
|
websocket.current.onopen = () => { |
|
|
|
|
setIsConnection(true); |
|
|
|
|
console.log('[Websocket Open] Connection Open'); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
websocket.onmessage = e => { |
|
|
|
|
websocket.current.onmessage = e => { |
|
|
|
|
const data = e.data; |
|
|
|
|
const controlGpList = JSON.parse(data); |
|
|
|
|
|
|
|
|
|
dispatch(Actions.controlGpAction.request(controlGpList)); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
websocket.onclose = event => { |
|
|
|
|
websocket.current.onclose = event => { |
|
|
|
|
setIsConnection(false); |
|
|
|
|
setTimeout(function () { |
|
|
|
|
connect(); |
|
|
|
|