title: NextJS and fetch interceptor working randomly
body: <p>I'm trying to modify all my requests to /v1/* to <a href="https://api.treedis.com/v1/" rel="nofollow noreferrer">https://api.treedis.com/v1/</a>*. Now it works very well using fetch-intercept with this code:</p>
  <pre><code>fetchIntercept.register({
    request(url, _config) {
      const config = _config;
      const myHeaders = new Headers();
  
      if (!config.headers || !config.headers[&quot;Content-Type&quot;]) {
        myHeaders.append(&quot;Accept&quot;, &quot;application/json&quot;);
        myHeaders.append(&quot;Content-Type&quot;, &quot;application/json&quot;);
      }
  
      let finalUrl = null;
      if (url.indexOf(&quot;http&quot;) === -1) {
        const domain = process.env.REACT_APP_DOMAIN || &quot;http://localhost:5030&quot;;
        finalUrl = `${domain}/${url}`;
      } else {
        finalUrl = url;
      }
      config.headers = myHeaders;
      return [finalUrl, config];
    },
  })
  </code></pre>
  <p><code>process.env.REACT_APP_DOMAIN</code> is set to api.treedis.com.</p>
  <p>This file is being imported in _app.js</p>
  <pre><code>import App from &quot;next/app&quot;;
  import Head from &quot;next/head&quot;;
  import &quot;../_helpers/auth-header&quot;;
  
  class MyApp extends App {
    render = () =&gt; {
      const { Component, pageProps } = this.props;
      return (
        &lt;&gt;
          &lt;Head /&gt;
          &lt;Component {...pageProps} /&gt;
        &lt;/&gt;
      );
    };
  }
  
  export default MyApp;
  
  </code></pre>
  <p>Now when I go to <a href="https://my.bc2e.com/tour/appartement-de-4-pieces-paris-5eme" rel="nofollow noreferrer">https://my.bc2e.com/tour/appartement-de-4-pieces-paris-5eme</a> (my NextJS app), it tries to go to v1/public/getTour. On my browser it works perfectly, but on my client's it shows the following:
  <a href="https://i.stack.imgur.com/9igdF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9igdF.png" alt="enter image description here" /></a></p>
  <p>So the fetch-intercept doesn't work for him. When he cleans the cache it works and the interceptor kicks in, but then it stops working after couple of refreshes.</p>
  <p>So it is quite random. Sometimes the interceptor would work and will add the <code>process.env.REACT_APP_DOMAIN</code>, and sometimes it wouldn't. I couldn't figure out why.</p>
  <p>Any ideas here?</p>
  <p>This NextJS app is hosted on CloudFront with Lambda@Edge doing the routing.</p>