title: GET http://127.0.0.1:8000/ net::ERR_CONNECTION_REFUSED error when fetching data from backend service on same webserver
body: <p>I have a very simple app running on a webserver. A bit of Javascript requests some data from a FastAPI service. When I visit the domain I get the following error in the console <code>GET http://0.0.0.0:8000/ net::ERR_CONNECTION_REFUSED</code>.</p>
  <p>If I ssh into the webserver, I can curl localhost:8000/ and get the data.</p>
  <p>So the webpage exists and the backend service is running. But the frontend isn't reaching the backend. Could someone explain what I am doing wrong here?</p>
  <pre class="lang-html prettyprint-override"><code>&lt;html&gt;
    &lt;head&gt;&lt;/head&gt;
    &lt;body&gt;
      &lt;h1&gt;RSS Reader&lt;/h1&gt;
      &lt;ul id=&quot;feeds_list&quot;&gt;&lt;/ul&gt;
    &lt;/body&gt;
    &lt;script&gt;
      const ul = document.getElementById(&quot;feeds_list&quot;);
  
      const data = fetch(&quot;http://127.0.0.1:8000/&quot;, {
        method: &quot;GET&quot;,
        headers: {
          &quot;Content-Type&quot;: &quot;application/json&quot;,
          &quot;Access-Control-Allow-Origin&quot;: &quot;*&quot;,
        },
        mode: &quot;cors&quot;,
      })
        .then((data) =&gt; {
          return data.json();
        })
        .then((res) =&gt; {
          res.forEach((element) =&gt; {
            const li = document.createElement(&quot;li&quot;);
            const a = document.createElement(&quot;a&quot;);
            a.appendChild(document.createTextNode(element.title));
            a.href = element.link;
            a.setAttribute(&quot;target&quot;, &quot;_blank&quot;);
            li.appendChild(a);
            ul.appendChild(li);
          });
        });
    &lt;/script&gt;
  &lt;/html&gt;
  </code></pre>
  <pre class="lang-py prettyprint-override"><code>import json
  from pathlib import Path
  
  import pandas as pd
  from fastapi import FastAPI
  from fastapi.middleware.cors import CORSMiddleware
  
  
  PARENT_DIR = Path(__file__).parent.parent.resolve()
  
  
  app = FastAPI()
  
  app.add_middleware(
      CORSMiddleware, allow_origins=[&quot;*&quot;], allow_credentials=True, allow_methods=[&quot;*&quot;], allow_headers=[&quot;*&quot;]
  )
  
  
  @app.get(&quot;/ping&quot;)
  def ping():
      return {&quot;ping&quot;: &quot;pong&quot;}
  
  
  @app.get(&quot;/&quot;)
  def root():
      df = pd.read_csv(f&quot;{PARENT_DIR}/data/latest.csv&quot;)
      df.to_json(f&quot;{PARENT_DIR}/data/latest.json&quot;, orient=&quot;records&quot;)
      with open(f&quot;{PARENT_DIR}/data/latest.json&quot;) as f:
          data = json.load(f)
          return data
  
  
  if __name__ == &quot;__main__&quot;:
      app()
  </code></pre>