Estoy tratando de usar WebSockets en métodos de ciclo de vida de reacción respectivamente. Con el siguiente código, solo la función inicial llama cuando un componente se monta por primera vez. luego dentro del método componentdidupdate didupdate. Estoy llamando a las funciones de envío y recepción que hice en los sockets. Puede rastrear el éxito del código mediante los mensajes de la consola en la imagen a continuación.

 import {initiateSocketAndSend,sendMessage,ReceiveMessage,disconnectSocket,onError} from '../scokets/sockets'; componentDidMount(){ initiateSocketAndSend() } componentDidUpdate(){ sendMessage(this.props) ReceiveMessage() onError() disconnectSocket() } componentWillUnmount(){ disconnectSocket() }

enchufes.js

 let ws; export const initiateSocketAndSend = () => { ws = new WebSocket("ws://localhost:8000/ws/projects/test_key"); // alert("conneted") console.log("connected") } export const sendMessage = (props) => { console.log("send",ws) //Reaching here ws.onopen = function() { // Web Socket is connected, send data using send() // console.log("do somethimg") // Not reaching here const send_object = JSON.stringify(props) // console.log("user",send_object) ws.send(send_object); console.log("Message is sent...") }; // ws.onopen = function (event) { // console.log("do somethimg") //Not // ws.send("Here's some text that the server is urgently awaiting!"); // }; } export const ReceiveMessage = () => { // Web Socket is connected, receive data ws.onmessage = function (event) { const data = JSON.parse(event.data); console.log(data["message"]) }; } export const onError = () => { ws.onerror = function(event) { console.log(event); } } export const disconnectSocket = () => { ws.onclose = function() { // websocket is closed. console.log("Connection is closed...") }; }