Despite using websocket index data not manipulating

Hello ,
I am using websocket and updating the option chain and nifty finnifty index for real time to gather required data .
the data come for only one time and then it stops there is not any continuesly flow for request and response while i am requesting to websocket it showing me when i refresh the page.
please guide me what should i do

The issue appears to originate from your side. To provide any suggestions, we would need details about your complete implementation. It seems that

app.get("/getFinniftychart", async (req, res) => {
  try {
    const url = "https://api.upstox.com/v2/option/chain";
    const params = {
      instrument_key: "NSE_INDEX|Nifty Fin Service",
      expiry_date: "2024-04-09",
    };
    const headers = {
      Accept: "application/json",
      Authorization: `Bearer ${OAUTH2.accessToken}`,
    };

    const optionChainResponse = await axios.get(url, { params, headers });
    const finniftysumb = "NSE_INDEX|Nifty Fin Service";
    const finmarketData = await getMarketQuoteData(finniftysumb, "I1");
    const intrafinniftyData = await finniftygetIntradayCandleData(
      finniftysumb,
      "1minute"
    );

    const responseData = {
      optionChainData: optionChainResponse.data,
      finmarketData,
      intrafinniftyData,
    };

    console.log(responseData);
    res.status(200).json(responseData);

    // Send the response to WebSocket clients
    sendWebSocketMessage(responseData);
  } catch (error) {
    console.log("Error:", error);
    res.status(500).json({ error: "Internal Server Error" });
  }
});
// Handle WebSocket connections
wss.on("connection", async (ws) => {
  console.log("WebSocket client connected");

  try {
    // Fetch finmarket data
    const finniftysumb = "NSE_INDEX|Nifty Fin Service";
    const finmarketData = await getMarketQuoteData(finniftysumb, "I1");
    ws.send(JSON.stringify({ marketQuoteData: finmarketData }));

    // Fetch intrafinnifty data
    const intrafinniftyData = await finniftygetIntradayCandleData(
      finniftysumb,
      "1minute"
    );
    ws.send(JSON.stringify({ intrafinniftyData }));

    // Fetch option chain data
    const optionChainResponse = await axios.get(
      "https://api.upstox.com/v2/option/chain",
      {
        params: {
          instrument_key: "NSE_INDEX|Nifty Fin Service",
          expiry_date: "2024-04-09",
        },
        headers: {
          Accept: "application/json",
          Authorization: `Bearer ${OAUTH2.accessToken}`,
        },
      }
    );

    const optionChainData = optionChainResponse.data;
    ws.send(JSON.stringify({ optionChainData }));
  } catch (error) {
    console.log("Error at finnifty", error);
  }
});
// Function to send data to all WebSocket clients
function sendWebSocketMessage(data) {
  wss.clients.forEach((client) => {
    if (client.readyState === WebSocket.OPEN) {
      client.send(JSON.stringify(data));
    }
  });
}
async function finniftygetIntradayCandleData(symbol, interval) {
  const niftyapiInstance = new UpstoxClient.HistoryApi();
  return new Promise((resolve, reject) => {
    niftyapiInstance.getIntraDayCandleData(
      symbol,
      interval,
      apiVersion,
      (error, data, response) => {
        if (error) {
          reject(error);
        } else {
          resolve(data);
        }
      }
    );
  });
}

above is backend code.

import React, { useEffect, useRef, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { selectCandleData, setCandleData } from "../../redux/stockSlice";
import { createChart } from "lightweight-charts";

const Tvfinnifty = () => {
  const [optionChainData, setOptionChainData] = useState(null);
  const candleData = useSelector(selectCandleData);
  const dispatch = useDispatch();
  const chartContainerRef = useRef(null);
  const chartInstance = useRef(null);
  const [emaPosition, setEmaPosition] = useState("");
  const [liveSpotPrice, setLiveSpotPrice] = useState("");

  useEffect(() => {
    const ws = new WebSocket("ws://localhost:8080");

    ws.onopen = () => {
      console.log("Connected to WebSocket server at frontend");
    };

    ws.onmessage = (event) => {
      try {
        const newData = JSON.parse(event.data);
        const candles = newData?.intrafinniftyData?.data?.candles;
        if (candles) {
          dispatch(setCandleData(candles));
          console.log("Received real-time update:", candles);
        }
        setOptionChainData(newData?.optionChainData);

        // Log optionChainData to the console
        console.log("Option Chain Data:", newData);
        console.log(
          "Option Chain Data spot price:",
          newData.optionChainData.data[0].underlying_spot_price
        );
        // Set the live spot price
        setLiveSpotPrice(newData.optionChainData.data[0].underlying_spot_price);
      } catch (error) {
        console.error("Error processing WebSocket message:", error);
      }
    };

    ws.onerror = (error) => {
      console.error("WebSocket error:", error);
    };

    return () => {
      ws.close();
    };
  }, [dispatch]);
  return (
    <div class="container-fluid">
      <h1>Fin Nifty Candlestick Chart</h1>
      <div class="pt-3">
        <p class="text-warning">Candle Position - {emaPosition}</p>
      </div>
      <div class="pt-3">
        <h6 class="text-center">Live Spot Price: {liveSpotPrice}</h6>
      </div>

      <div ref={chartContainerRef} style={{ width: "100%", height: "500px" }} />

      {optionChainData && (
        <div>
          <pre>{JSON.stringify(optionChainData, null, 2)}</pre>
        </div>
      )}
    </div>
  );
};

export default Tvfinnifty;

here is photo when ws is connected 101 status is there.


.
there might be unable to send request from server to websocket hence i am getting responsse only when i refresh the page.

@Pradeep_Jaiswar waiting since 3 days