title: Making a server-sided "localhost" API call in Javascript
body: <p>In Javascript, it is possible to load server-sided files via HTML or Javascript. I am trying to do the same thing except via an API call instead of a file directly (as this file is automatically generated).</p>
  
  <p>I'm hosting a <code>flask</code> server that's being served to <code>http://0.0.0.0:5000/</code> on a remote linux server, and I am able to make a <code>GET</code> request on the server via command line using <code>wget http://localhost:5000/data</code> and it will return the correct result.</p>
  
  <p>However, if I try to make an <code>ajax</code> call on an <code>html</code> page it instead tries to <code>GET</code> data from my local computer's <code>localhost</code> rather than the server's <code>localhost</code></p>
  
  <p>For example, I have a simple <code>index.html</code> on the server, served by <code>nginx</code>:</p>
  
  <pre><code> &lt;script
    src="https://code.jquery.com/jquery-3.2.1.min.js"
    integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
    crossorigin="anonymous"&gt;
  &lt;/script&gt;
  &lt;script&gt;
  var url = "http://127.0.0.1:5000/data"
  $.ajax({
    dataType: "json",
    url: url,
    success: function( data ) {
      console.log(data)
    }
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>But it doesn't seem to call on the server's localhost, and instead calls on the localhost of my computer. (i.e. it returns the results only if I am running the API service locally as well, and <code>ERR_CONNECTION_REFUSED</code> otherwise). How can I make it call on the "server"s localhost? Is this even possible to do?</p>
  
  <p>An obvious workaround would be to process the file on the server and then save it to disk, and then call on the file directly via <code>ajax</code>, but I would like to avoid this if possible.</p>