502 when using websockets

import React, { useEffect, useState } from "react";import "../App.css";import Maps from "./Maps";import SideNavigation from "../Sidebar/Navigation";import axios from "axios";import io from "socket.io-client";import { faVolumeUp, faVolumeXmark } from "@fortawesome/free-solid-svg-icons";import Cookies from "js-cookie";const socket = io.connect(`${process.env.REACT_APP_SERVER_IP}:3001`, { withCredentials: true, transports: [ "websocket" ] });export const Location = () => {    const [shake, setShake] = useState(false);    const [state, setState] = useState(false);    const [lat, setLat] = useState("");    const [lng, setLng] = useState("");    const [gpsTime, setGPSTime] = useState("");    const [disconnected, setDisconnected] = useState(true);    const [speaker, setSpeaker] = useState(true);    async function getData() {        const userID = Cookies.get("userID");        const response = await axios.get(            `${process.env.REACT_APP_SERVER_IP}/api/getData?userID=${userID}`        );        if (response.data.state === 0) {            setState(false);            setSpeaker(faVolumeXmark);            setShake(false);        } else if (response.data.state === 1) {            setState(true);            setSpeaker(faVolumeUp);            setShake(true);        } else {            console.log(response);        }    }    function checkConnectivity() {        if(lng === "" || lat === "") {            setDisconnected(true);        }    }    async function getGPS() {        const userID = Cookies.get("userID");        if(lng === "" || lat === "") {            const response = await axios.get(                `${process.env.REACT_APP_SERVER_IP}/api/getGPS/${userID}`            );            setLat(response.data.latitude);            setLng(response.data.longitude);            setGPSTime(response.data.updatedDateTime);            setDisconnected(true);        }    }    async function buzzer(event) {        event.stopPropagation();        const userID = Cookies.get("userID");        fetch(`${process.env.REACT_APP_SERVER_IP}/api/updateBuzzer/${userID}`, {            headers: {"Content-Type": "application/json",            },            method: "PUT",            body: JSON.stringify({                state: !state,                output: "buzzer",            }),        }).then([            setShake(!shake),            setState(!state),            state ? setSpeaker(faVolumeUp) : setSpeaker(faVolumeXmark),        ]);    }    useEffect(() => {        getData();        checkConnectivity();        getGPS();        socket.on("postData", (data) => {            if (!data.lat || !data.lng || !data.lat === 0 || !data.lng === 0) {                getGPS();            } else {                setLat(data.lat);                setLng(data.lng);                setGPSTime(data.dateTime);                setDisconnected(false);            }        });    }, [shake, state, lat, lng, gpsTime, disconnected, speaker]);    return (<div className="d-flex flex-row"><div><SideNavigation></SideNavigation></div><div                style={{ width: "100%", height: "100vh" }}                className="d-flex flex-column"><Maps                    buzzer={buzzer}                    shake={shake}                    lat={lat}                    lng={lng}                    gpsTime={gpsTime}                    disconnected={disconnected}                    speaker={speaker}                /></div></div>    );};

Before socket.on:Response headers:HTTP/1.1 200 OKServer: nginx/1.18.0 (Ubuntu)Date: Thu, 18 Apr 2024 10:43:12 GMTContent-Type: application/json; charset=utf-8Content-Length: 11Connection: keep-aliveX-Powered-By: ExpressAccess-Control-Allow-Origin: https://www.inswalst.comVary: OriginAccess-Control-Allow-Credentials: trueETag: W/"b-P4CuhGK30Ou/ASQzSDPwfuj0UVU"

Request headers:GET /api/getData?userID=1713172252 HTTP/1.1Host: inswalst.comUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/115.0Accept: application/json, text/plain, /Accept-Language: en-US,en;q=0.5Accept-Encoding: gzip, deflate, brOrigin: https://www.inswalst.comConnection: keep-aliveReferer: https://www.inswalst.com/Sec-Fetch-Dest: emptySec-Fetch-Mode: corsSec-Fetch-Site: same-site

When socket.on:Response headers:HTTP/1.1 502 Bad GatewayServer: nginx/1.18.0 (Ubuntu)Date: Thu, 18 Apr 2024 10:49:13 GMTContent-Type: text/htmlContent-Length: 166Connection: keep-alive

Request headers:GET /api/getData?userID=1713172252 HTTP/1.1Host: inswalst.comUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/115.0Accept: application/json, text/plain, /Accept-Language: en-US,en;q=0.5Accept-Encoding: gzip, deflate, brOrigin: https://www.inswalst.comConnection: keep-aliveReferer: https://www.inswalst.com/Sec-Fetch-Dest: emptySec-Fetch-Mode: corsSec-Fetch-Site: same-siteIf-None-Match: W/"b-P4CuhGK30Ou/ASQzSDPwfuj0UVU"

Why I get 502 for https://inswalst.com/api/getData?userID=1713172252 when socket.on? How to solve it?