diff --git a/src/components/websocket/WebsocketClient.js b/src/components/websocket/WebsocketClient.js index 0da8a2c0..7bfb2bc2 100644 --- a/src/components/websocket/WebsocketClient.js +++ b/src/components/websocket/WebsocketClient.js @@ -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();