title: JS file caching is different when included via script tag vs GET
body: <p>I've been stuck in caching hell for the past couple of days and while I'm starting to get it still struggling a little bit. </p>
  
  <p><strong>Desired Result</strong><br />
  I want to include a JS file on a site and have it cached and/or only fetch a new copy of the file when the file has been changed on the server. I DO CANNOT use version tags or hashes in the file name. The file name needs to stay consistent. </p>
  
  <p><strong>Where I'm at</strong><br />
  From what I understand after reading up on this using Etags are the perfect solution for this. They will update when the file is changed and will send the new version of the file if tags don't match. And this seems to work when I request the file via the browser</p>
  
  <p>So you can see that on first request i get a 200 and download size is 292 B and on second request because tags match I get a 304 and download size is 137 B (Just header size I assume). Great! <strong>This is exactly what I want.</strong> </p>
  
  <p><a href="https://i.stack.imgur.com/iEDtQ.png" rel="noreferrer"><img src="https://i.stack.imgur.com/iEDtQ.png" alt="enter image description here"></a></p>
  
  <p>My request header with looks for the etag:
  <a href="https://i.stack.imgur.com/delU0.png" rel="noreferrer"><img src="https://i.stack.imgur.com/delU0.png" alt="enter image description here"></a></p>
  
  <p><strong>My Problem</strong><br />
  Now this works when I request the file from the browser, but adding a js file in a script tag doesn't send request headers the same way. So, opening the following html file</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;body&gt;
          &lt;script src="https://myTestSite.com/testCache.js"&gt; 
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My js file is fetched every time because the <code>if-none-match</code> request header is not present. How do I replicate the behavior that was observed in the above scenario when using html script tag? 
  <a href="https://i.stack.imgur.com/Wih0t.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Wih0t.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/cHWMF.png" rel="noreferrer"><img src="https://i.stack.imgur.com/cHWMF.png" alt="enter image description here"></a></p>
  
  <p><strong>TL;DR</strong><br />
  How do I use Etags to request only modified JS files when using html script tags and not simple browser GET request? </p>