title: Download image after authentication from api and cache that image using browser cache in angular 5
body: <p>I am trying to download and show image in my angular app. </p>
  
  <p><code>&lt;img [src]="https://localhost:4100/attachment/123.jpg" /&gt;</code></p>
  
  <p>First problem I am facing is that I am not able to pass authentication header in image source. I read an answer regarding this here that we can't set/send header in html for that i have to download the blob from api and set src attribute to blob url, which works great.</p>
  
  <p>But after doing that change the second problem I am facing is that browser cache is not working as I have to download the same resource again and again on page refresh or routing and set the src with different blob url every time. I don't want to cache resource in local storage as its size exceeds and send authentication token in url.</p>