But I'm having a hard time figuring out how to combine this with an Azure CDN on top of an Azure BLOb Storage container.
We normally use the Azure BLOb Storage File System Provider and have the media served from public BLOb Storage URLs. But this only works for normal media, or pre-rendered crops of some sort.
Using Azure CDN on a Storage container (or using public BLOb Storage container URLs) means all crops would have to be pre-rendered somehow.
Or would we have to use an Azure CDN that works as a reverse proxy and pulls media from the web site using the normal web site crop URL? I.e. not a CDN that extends an existing BLOb Storage container.
If the image has been processed before, it's already in the CDN and that is what's returned, the website doesn't ever receive the image request, the CDN is doing it's job!
If the image isn't in the CDN then the CDN will request it from the website (make sure to set the Azure CDN to cache each querystring uniquely, otherwise the first crop request will be used for all subsequent requests for that image)
When the request comes in from the CDN to the website, then Image Processor handles the request, and if the site is configured to use blob storage that's where the image will be retrieved from - with the default configuration in place, Image processor will perform a redirect to wherever it's configured to store it's cache of processed images (usually also in blob storage) and returns the image, which the CDN then remembers for future requests.
There is a config setting for Image Processor in /config/imageprocessor/cache.config called StreamCachedImage, if you set this to true, then you avoid the default redirect hop, which is unnecessary now your using a CDN
However, I don't understand the redirect part. I'm not seeing any redirects, neither from https://web.site/media/x/y.png?cropSettings nor from the CDN endpoint. Can you elaborate?
We don't use the Azure BLOb Storage Cache, we use the ootb AppData cache, which means no redirects are made. So our current setup seems sufficient.
And seeing that the entire ImageProcessor is deprecated (and most likely won't be in Unicore, I suppose) it looks like we don't want to configure it more than necessary. So we'll probably leave the ImageProcessor cache at the default AppData setting and only store actual media in Azure BLOb Storage.
Or is there a reason why using AppData as ImageProcessor cache while using Azure BLOb Storage for media would be undesirable?
I think there will be plans to use ImageSharp in the .net core version of Umbraco, and so it will be a similar experience, but also that's over a year away!
But yes, if you are not putting your Image Processor cache in blob storage then that's why you are not seeing the redirect I was talking glibly about needing to handle!
The only thing to consider with having the cache stored in Appdata is how big it grows too, which will depend on your site, and how many images etc, and how often it's purged etc - I've had the cache eat up server resources before and take a site down - so I tend to always put the cache also in blob storage... but it's not a must-do if that's an unlikely situation in your circumstances...
Thanks for the heads-up. No glibbity, I assure you.
I'll do some experimenting with using Azure BLOb Storage as an ImageProcessor cache, and configuring it to stream cached files instead of redirecting!
Also, it sounds like there are some "best practices" here. Let's hope this forum thread can serve as inspiration to others, for want of a proper best practice knowledge base.
Image CDN & dynamic crops
Is anyone using Azure CDN (or another CDN) & dynamic crops, i.e. requesting specific crops when requesting an image?
We are planning a web site around dynamic crops (aka custom crops) like this:
But I'm having a hard time figuring out how to combine this with an Azure CDN on top of an Azure BLOb Storage container.
We normally use the Azure BLOb Storage File System Provider and have the media served from public BLOb Storage URLs. But this only works for normal media, or pre-rendered crops of some sort.
If we serve media via Umbraco, i.e. using
https://web.site/media/x/image.png?cropSettingsas image URLs, then dynamic crops would work. But this takes a CDN out of the equation.Using Azure CDN on a Storage container (or using public BLOb Storage container URLs) means all crops would have to be pre-rendered somehow.
Or would we have to use an Azure CDN that works as a reverse proxy and pulls media from the web site using the normal web site crop URL? I.e. not a CDN that extends an existing BLOb Storage container.
Or is there some other way to go about this?
Hi Per
Yes, normally the Azure CDN is setup to have it's source point to the media folder of the website.
You update all your requests for images in your templates to be prefixed by the CDN domain
If the image has been processed before, it's already in the CDN and that is what's returned, the website doesn't ever receive the image request, the CDN is doing it's job!
If the image isn't in the CDN then the CDN will request it from the website (make sure to set the Azure CDN to cache each querystring uniquely, otherwise the first crop request will be used for all subsequent requests for that image)
When the request comes in from the CDN to the website, then Image Processor handles the request, and if the site is configured to use blob storage that's where the image will be retrieved from - with the default configuration in place, Image processor will perform a redirect to wherever it's configured to store it's cache of processed images (usually also in blob storage) and returns the image, which the CDN then remembers for future requests.
There is a config setting for Image Processor in /config/imageprocessor/cache.config called StreamCachedImage, if you set this to true, then you avoid the default redirect hop, which is unnecessary now your using a CDN
https://imageprocessor.org/imageprocessor-web/plugins/azure-blob-cache/#config
That's the gist of it anyhow!
Regards
Marc
Thank you.
So, essentially,
From preliminary testing it seems to work right out of the box for e.g.
Good stuff!
However, I don't understand the redirect part. I'm not seeing any redirects, neither from
https://web.site/media/x/y.png?cropSettingsnor from the CDN endpoint. Can you elaborate?Hi Per
There is a good explanation on the issue which I think led to the stream cached image being added...
https://github.com/JimBobSquarePants/ImageProcessor/issues/178
That hopefully explains it a bit better than me!
Regards
Marc
I see.
We don't use the Azure BLOb Storage Cache, we use the ootb AppData cache, which means no redirects are made. So our current setup seems sufficient.
And seeing that the entire ImageProcessor is deprecated (and most likely won't be in Unicore, I suppose) it looks like we don't want to configure it more than necessary. So we'll probably leave the ImageProcessor cache at the default AppData setting and only store actual media in Azure BLOb Storage.
Or is there a reason why using AppData as ImageProcessor cache while using Azure BLOb Storage for media would be undesirable?
Hi Per
I think there will be plans to use ImageSharp in the .net core version of Umbraco, and so it will be a similar experience, but also that's over a year away!
But yes, if you are not putting your Image Processor cache in blob storage then that's why you are not seeing the redirect I was talking glibly about needing to handle!
The only thing to consider with having the cache stored in Appdata is how big it grows too, which will depend on your site, and how many images etc, and how often it's purged etc - I've had the cache eat up server resources before and take a site down - so I tend to always put the cache also in blob storage... but it's not a must-do if that's an unlikely situation in your circumstances...
regards
Marc
Thanks for the heads-up. No glibbity, I assure you.
I'll do some experimenting with using Azure BLOb Storage as an ImageProcessor cache, and configuring it to stream cached files instead of redirecting!
Also, it sounds like there are some "best practices" here. Let's hope this forum thread can serve as inspiration to others, for want of a proper best practice knowledge base.
Hi Per
(Yes this kind of is the knowledge base :-P)
But the documentation accepts PRs!
https://github.com/umbraco/UmbracoDocs
could put together an Azure CDN guide?
But the question is 'where would you expect to find it?' maybe here perhaps?
https://our.umbraco.com/Documentation/Extending/FileSystemProviders/Azure-Blob-Storage/
it's certainly a common enough query.
regards
Marc
is working on a reply...