title: Proxy API request using React Router
body: <p>I'm trying to set up a proxy to handle GET and POST requests. I have done this many times without using react-router in prior react apps and it's works perfect, however since this app uses react-router it fails. </p>
  
  <p>The proxy isn't working, instead trying to do the call on the localhost domain:</p>
  
  <pre><code>ok: false
  redirected: false
  status: 500
  statusText: "Internal Server Error"
  url: "http://localhost:3001/api/call"
  </code></pre>
  
  <p>I am not doing anything fancy with my react router:</p>
  
  <pre><code>&lt;Router history={history}&gt;
      &lt;Switch&gt;
          &lt;Route path="/" component={Home} /&gt;
          &lt;Route path="about" component={About} /&gt;
      &lt;/Switch&gt;
  &lt;/Router&gt;
  </code></pre>
  
  <p>Here is the proxy (in setupProxy.js):</p>
  
  <pre><code>const proxy = require('http-proxy-middleware');
  
  module.exports = function(app) {
    app.use(proxy('/api/call', { target: "http://www.domain.com.au/", changeOrigin: true } ));
  };
  </code></pre>
  
  <p>Here is a sample of how it's used:</p>
  
  <pre><code>add(data) {
  
      this.setState({button: "loading"})
  
      fetch('/api/call', {
          method: "POST",
          headers: {
              "Content-Type": "application/json"
          },
          body: JSON.stringify(data)
      })
      .then(res =&gt; this.setState({success: res.ok}))
      .catch(err =&gt; this.setState({success: false}))
  
  }
  </code></pre>
  
  <p>Do I need to do anything extra to make this work when using react-router?</p>