title: while loading react app error , polling-xhr.js:203 GET https://localhost:8001/socket.io/?EIO=4&transport=polling&t=NZJdzB8 net::ERR_CONNECTION_REFUSED
body: <p>I am beginner and trying to build a simple chat application with <code>socket.io</code> but when I am connecting <code>socket.io-client</code> with the backend it is reproducing the above mentioned error. I am unable to understand the meaning of the above error so please help me debug my code and understand the meaning and cause of error.</p>
  <h2>server-side code</h2>
  <pre><code>const express = require(&quot;express&quot;);
  const socketIo = require(&quot;socket.io&quot;);
  const http = require(&quot;http&quot;);
  const router = require(&quot;./router&quot;);
  const PORT = 8001;
  const cors = require(&quot;cors&quot;);
  
  const app = express();
  
  const server = http.createServer(app);
  
  //middlewares
  app.use(router);
  app.use(cors());
  
  const io = socketIo(server);
  // var so = io(&quot;https://yourDomain:3000&quot;, { transport: [&quot;websocket&quot;] });
  //socket.io
  io.on(&quot;connection&quot;, (socket) =&gt; {
    console.log(&quot;We have a new connection!!!&quot;);
  
    socket.on(&quot;join&quot;, ({ name, room }) =&gt; {
      console.log(name, room);
    });
    socket.on(&quot;disconnect&quot;, () =&gt; {
      console.log(&quot;User has left!!!&quot;);
    });
  });
  
  //listening on server
  server.listen(8000, (err) =&gt; {
    if (err) {
      console.log(`Error: ${err}`);
      return;
    }
    console.log(`Server started on port: ${PORT}`);
  });
  </code></pre>
  <h2><code>package.json</code> for server-side</h2>
  <pre><code>{
    &quot;name&quot;: &quot;real-chat-application&quot;,
    &quot;version&quot;: &quot;1.0.0&quot;,
    &quot;description&quot;: &quot;&quot;,
    &quot;main&quot;: &quot;index.js&quot;,
    &quot;scripts&quot;: {
      &quot;test&quot;: &quot;echo \&quot;Error: no test specified\&quot; &amp;&amp; exit 1&quot;,
      &quot;start&quot;: &quot;nodemon index.js&quot;
    },
    &quot;keywords&quot;: [],
    &quot;author&quot;: &quot;&quot;,
    &quot;license&quot;: &quot;ISC&quot;,
    &quot;dependencies&quot;: {
      &quot;cors&quot;: &quot;^2.8.5&quot;,
      &quot;express&quot;: &quot;^4.17.1&quot;,
      &quot;nodemon&quot;: &quot;^2.0.7&quot;,
      &quot;query-string&quot;: &quot;^7.0.0&quot;,
      &quot;react-emoji&quot;: &quot;^0.5.0&quot;,
      &quot;react-router&quot;: &quot;^5.2.0&quot;,
      &quot;react-scroll-to-bottom&quot;: &quot;^4.1.0&quot;,
      &quot;socket.io&quot;: &quot;^4.0.1&quot;,
      &quot;socket.io-client&quot;: &quot;^4.0.1&quot;
    }
  }
  </code></pre>
  <h2>my chat component client-side where i am using <code>socket.io-client</code></h2>
  <pre><code>import React, { useEffect, useState } from 'react';
  import queryString from 'query-string';
  import io from 'socket.io-client';
  
  import './Chat.css';
  let socket;
  function Chat({ location }) {
    //state hook
    // eslint-disable-next-line
    const [name, setName] = useState('');
    const [room, setRoom] = useState('');
    const ENDPOINT = 'https://localhost:8001';
    useEffect(() =&gt; {
      const { name, room } = queryString.parse(location.search);
      // const data = queryString.parse(location.search);
      // console.log('location', location);
      // console.log('location.search: ', location.search);
      // console.log('data: ', data);
      setName(name);
      setRoom(room);
      socket = io(ENDPOINT);
      console.log(socket);
      socket.emit('join', { name, room });
      console.log(socket);
    }, [ENDPOINT, location.search]);
    return &lt;div&gt;Chat page&lt;/div&gt;;
  }
  
  export default Chat;
  </code></pre>
  <h2><code>package.json</code> for client-side</h2>
  <pre><code>{
    &quot;name&quot;: &quot;client&quot;,
    &quot;version&quot;: &quot;0.1.0&quot;,
    &quot;private&quot;: true,
    &quot;dependencies&quot;: {
      &quot;@testing-library/jest-dom&quot;: &quot;^5.11.10&quot;,
      &quot;@testing-library/react&quot;: &quot;^11.2.6&quot;,
      &quot;@testing-library/user-event&quot;: &quot;^12.8.3&quot;,
      &quot;query-string&quot;: &quot;^7.0.0&quot;,
      &quot;react&quot;: &quot;^17.0.2&quot;,
      &quot;react-dom&quot;: &quot;^17.0.2&quot;,
      &quot;react-router-dom&quot;: &quot;^5.2.0&quot;,
      &quot;react-scripts&quot;: &quot;4.0.3&quot;,
      &quot;socket.io-client&quot;: &quot;^4.0.1&quot;,
      &quot;web-vitals&quot;: &quot;^1.1.1&quot;
    },
    &quot;scripts&quot;: {
      &quot;start&quot;: &quot;react-scripts start&quot;,
      &quot;build&quot;: &quot;react-scripts build&quot;,
      &quot;test&quot;: &quot;react-scripts test&quot;,
      &quot;eject&quot;: &quot;react-scripts eject&quot;
    },
    &quot;eslintConfig&quot;: {
      &quot;extends&quot;: [
        &quot;react-app&quot;,
        &quot;react-app/jest&quot;
      ]
    },
    &quot;browserslist&quot;: {
      &quot;production&quot;: [
        &quot;&gt;0.2%&quot;,
        &quot;not dead&quot;,
        &quot;not op_mini all&quot;
      ],
      &quot;development&quot;: [
        &quot;last 1 chrome version&quot;,
        &quot;last 1 firefox version&quot;,
        &quot;last 1 safari version&quot;
      ]
    }
  }
  </code></pre>