Imageprocessor: Cache-control header missing on cached images coming from s3 - not caching on browser.

[jattwood]

Hi James,

Thank you for AmazonS3Cache! I have all images successfully caching on S3. Interestingly, there is no cache-control response header for these images coming from umbraco using the CloudImageService provider. As a result, all my server cached images download each time from the server instead of loading from disk or memory caches.

I see in the umbraco Diskcache there is an attribute called browserMaxDays="7" that seems to control the http header for cache-control. I tried same on the AmazonS3Cache to no avail.

I have also tried setting the cache-control expiry on the S3 bucket itself but it does not percolate down through the mix to the browser.

Any Ideas??

Thank-you

<cache name="AmazonS3Cache" type="ImageProcessor.Web.Plugins.AmazonS3Cache.AmazonS3Cache, ImageProcessor.Web.Plugins.AmazonS3Cache" maxDays="365">
      <settings>
        <!-- AWS Security. Add AwsAccessKey and AwsSecretKey for a user that has full permissions." -->
        <setting key="AwsAccessKey" value="" />
        <setting key="AwsSecretKey" value="" />
        <!-- Name of the s3 bucket that will contain your cache" -->
        <setting key="AwsBucketName" value="" />
        <!-- Name of the s3 folder that will hold the cache" -->
        <setting key="AwsCacheKeyPrefix" value="cache" />
        <!-- Name of the s3 endpoint name. eg: ca-central-1" -->
        <setting key="RegionEndpoint" value="ca-central-1" />
        <!-- Name of the s3 endpoint name where the image source is located. eg: ca-central-1" -->
        <setting key="SourceRegionEndpoint" value="ca-central-1" />
        <!-- url to the root of your s3 bucket. Eg: https://xxxxx.s3.ca-central-1.amazonaws.com/" -->
        <setting key="CachedCDNRoot" value="https://xxxxxxx.ca-central-1.amazonaws.com/" />
        <setting key="CloudSourceURI" value="https://xxxxxx.s3.ca-central-1.amazonaws.com/media/" />
        <setting key="CachedCDNTimeout" value="2000" />
        <setting key="StreamCachedImage" value="false" />
      </settings>
    </cache>

[ronaldbarendse]

The AmazonS3Cache does upload the images with a Cache-Control header containing the configured MaxDays, so that should be used when S3 responds to a request and make sure the actual image is cached in your browser:
https://github.com/JimBobSquarePants/ImageProcessor/blob/3dfd484e50674a82257246905df0ed87b5a832f5/src/ImageProcessor.Web.Plugins.AmazonS3Cache/AmazonS3Cache.cs#L332-L336

When the StreamCachedImage setting is true, ImageProcessor does use the BrowserMaxDays for the response:
https://github.com/JimBobSquarePants/ImageProcessor/blob/3dfd484e50674a82257246905df0ed87b5a832f5/src/ImageProcessor.Web.Plugins.AmazonS3Cache/AmazonS3Cache.cs#L475-L480

The redirects to S3 however are not cached, as seen in your screenshot: there's no Cache-Control header present. Feel free to submit a PR that correctly sets this header before redirecting:
https://github.com/JimBobSquarePants/ImageProcessor/blob/3dfd484e50674a82257246905df0ed87b5a832f5/src/ImageProcessor.Web.Plugins.AmazonS3Cache/AmazonS3Cache.cs#L492
https://github.com/JimBobSquarePants/ImageProcessor/blob/3dfd484e50674a82257246905df0ed87b5a832f5/src/ImageProcessor.Web.Plugins.AmazonS3Cache/AmazonS3Cache.cs#L506
https://github.com/JimBobSquarePants/ImageProcessor/blob/3dfd484e50674a82257246905df0ed87b5a832f5/src/ImageProcessor.Web.Plugins.AmazonS3Cache/AmazonS3Cache.cs#L524

[JimBobSquarePants]

@ronaldbarendse Good cache on the redirect!

I wish I could rewrite the APIs to simply stream the cached image instead of relying on a redirect but that would be a major breaking change.

[jattwood]

Thank you guys for your quick responses! If it’s a pretty easy header addition I can try a PR, but don’t want to meddle. Thank you.

Jamie Attwood

---

From: James Jackson-South [e-mail]
Sent: Wednesday, January 22, 2020 10:16:54 PM
To: JimBobSquarePants/ImageProcessor [e-mail]
Cc: Jamie Attwood [e-mail]; Author [e-mail]
Subject: Re: [JimBobSquarePants/ImageProcessor] Cache-control header missing on cached images coming from s3 - not caching on browser. (#781)

@ronaldbarendsehttps://github.com/ronaldbarendse Good cache on the redirect!

I wish I could rewrite the APIs to simply stream the cached image instead of relying on a redirect but that would be a major breaking change.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHubhttps://github.com/JimBobSquarePants/ImageProcessor/issues/781?email_source=notifications&email_token=ABRHLCER3XODU5ZXRSXWSELQ7ED2NA5CNFSM4KKNMMG2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEJV34BQ#issuecomment-577486342, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ABRHLCHXSXK6P76CWYSPIHLQ7ED2NANCNFSM4KKNMMGQ.

[jattwood]

Untested, but I think adding this above lines 492, 506 and 524 could do the trick. Not sexy, but might do the trick....not sure if you would want to add any other headers like If-Modified-Since or If-None-Match.
context.Response.Headers.Add("Cache-Control", String.Format("max-age={0}", this.BrowserMaxDays * 86400));

Sorry I am not able to successfully build right now to test this...

[ronaldbarendse]

You should use the ImageProcessingModule.SetHeaders() method or otherwise directly set the options on context.Response.Cache to add the correct caching headers... That way you don't have to manually write the header value and calculate the minutes!

The If-Modified-Since and If-None-Match headers do not apply to redirects, as there's nothing to conditionally download.

[JimBobSquarePants]

Fixed and deployed to Nuget.

[jattwood]

Amazing. Thank-you!

From: James Jackson-South [e-mail]
Sent: February 26, 2020 6:48 AM
To: JimBobSquarePants/ImageProcessor [e-mail]
Cc: Jamie Attwood [e-mail]; Author [e-mail]
Subject: Re: [JimBobSquarePants/ImageProcessor] Cache-control header missing on cached images coming from s3 - not caching on browser. (#781)

Fixed and deployed to Nuget.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHubhttps://github.com/JimBobSquarePants/ImageProcessor/issues/781?email_source=notifications&email_token=ABRHLCCE5KPB6MF344FCU6DREZJGDA5CNFSM4KKNMMG2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEM75NIY#issuecomment-591386275, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ABRHLCBOT2Z36I6AIFV3SCTREZJGDANCNFSM4KKNMMGQ.