Generateurv2/frontend/hooks/useWebsocket.jsx
2022-05-18 10:15:54 +02:00

59 lines
1.5 KiB
JavaScript

import { useCallback, useEffect, useState } from "react";
import ReconnectingWebSocket from "reconnecting-websocket";
import { isBrowser } from "../utils/utils.js";
import useReconnecting from "./useReconnecting.jsx";
export default function useWebsocket() {
const [ws, setWs] = useState(null);
const [url, setUrl] = useState();
const connect = (url) => {
setWs(new ReconnectingWebSocket(url));
};
const reconnect = (id_code, clientId) => {
if (ws == null) {
let tmpWs = new ReconnectingWebSocket(
`ws://192.168.1.18:8000/ws/room/${id_code}`
);
tmpWs.send(
JSON.stringify({
data: {
type: "reconnect",
clientId: clientId,
},
})
);
setWs(tmpWs);
tmpWs = null;
}
};
const [messageHandlers, setMessageHandlers] = useState(new Set());
const addMessageHandler = (handler) => {
let newSet = messageHandlers;
newSet.add(handler);
setMessageHandlers(newSet);
};
const removeMessageHandler = (handler) => {
let newSet = messageHandlers;
newSet.delete(handler);
setMessageHandlers(newSet);
};
useEffect(() => {
if (isBrowser && ws != null) {
ws.onmessage = (e) => {
console.log('Handler principal',e )
messageHandlers.forEach((handler) => {
handler(e);
});
};
}
}, [ws, messageHandlers]);
return { connect, addMessageHandler, removeMessageHandler, reconnect, ws };
}