|
|
|
@ -2,25 +2,59 @@ import React, { useEffect, useState, useRef } from 'react';
|
|
|
|
|
import { VscLoading } from 'react-icons/vsc'; |
|
|
|
|
import { useDispatch, useSelector } from '@src/redux/store'; |
|
|
|
|
import { useHistory } from 'react-router-dom'; |
|
|
|
|
import { WS_HOST } from '../../configs/constants'; |
|
|
|
|
import { WS_HOST, DOS_HOST } from '../../configs/constants'; |
|
|
|
|
import { getControlGp } from '@src/redux/features/control/gp/gpThunk'; |
|
|
|
|
import { getLaancAprvList } from '@src/redux/features/laanc/laancThunk'; |
|
|
|
|
const WebsocketClient = () => { |
|
|
|
|
const dispatch = useDispatch(); |
|
|
|
|
const history = useHistory(); |
|
|
|
|
const reConnectionTime = 5000; //5초
|
|
|
|
|
|
|
|
|
|
const { laancAprvParam } = useSelector(state => state.laancState); |
|
|
|
|
const laancAprvParamRef = useRef(laancAprvParam); |
|
|
|
|
|
|
|
|
|
const [isConnection, setIsConnection] = useState(false); |
|
|
|
|
const websocket = useRef(null); |
|
|
|
|
const timeout = useRef(null); |
|
|
|
|
|
|
|
|
|
const [isDosConnection, setIsDosConnection] = useState(false); |
|
|
|
|
const dosWebsocket = useRef(null); |
|
|
|
|
const dosTimeout = useRef(null); |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
connect(); |
|
|
|
|
dosConnect(); |
|
|
|
|
return () => { |
|
|
|
|
websocket.current.close(); |
|
|
|
|
clearTimeout(timeout.current); |
|
|
|
|
|
|
|
|
|
dosWebsocket.current.close(); |
|
|
|
|
clearTimeout(dosTimeout.current); |
|
|
|
|
}; |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
laancAprvParamRef.current = laancAprvParam; |
|
|
|
|
}, [laancAprvParam]); |
|
|
|
|
|
|
|
|
|
const dosConnect = () => { |
|
|
|
|
dosWebsocket.current = new WebSocket(DOS_HOST); |
|
|
|
|
|
|
|
|
|
dosWebsocket.current.onopen = () => { |
|
|
|
|
setIsDosConnection(true); |
|
|
|
|
console.log('[DOS Websocket Open] Connection Open'); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
dosWebsocket.current.onmessage = e => { |
|
|
|
|
const data = e.data; |
|
|
|
|
|
|
|
|
|
const key = JSON.parse(data); |
|
|
|
|
|
|
|
|
|
console.log(key, '-------'); |
|
|
|
|
dispatch(getLaancAprvList({ ...laancAprvParamRef.current })); |
|
|
|
|
}; |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
const connect = () => { |
|
|
|
|
websocket.current = new WebSocket(WS_HOST); |
|
|
|
|
|
|
|
|
@ -60,7 +94,9 @@ const WebsocketClient = () => {
|
|
|
|
|
} |
|
|
|
|
return ( |
|
|
|
|
<div> |
|
|
|
|
<span className={isConnection ? 'socket_on' : 'socket_off'}> |
|
|
|
|
<span |
|
|
|
|
className={isConnection && isDosConnection ? 'socket_on' : 'socket_off'} |
|
|
|
|
> |
|
|
|
|
<VscLoading size={25} /> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|