Images with querystring using S3 storage throwing 500 error
We're using Umbraco.Storage.S3 (version 1.0.0) to host media files, which all works successfully. Umbraco version is 7.2.8
We recently installed the Articulate blog plugin, and when an image is chose to be the blog logo it adds on querystring parameters to the end of the image name when it saves it. e.g. /media/1007/cmf-3135-r-7-27-15.gif?mode=max&rnd=130996323070000000
The image loads fine without querystring values (and behind the scenes Umbraco pulls this file from S3). However, once querystring values are added for images, it redirects to the 500 page.
I've been trying to identify the source of the issue without any luck. There are no logs for the error itself - a log entry exists for the first URL request (/media/1007/cmf-3135-r-7-27-15.gif?mode=max&rnd=130996323070000000), followed immediately by the request for the 500 page (/error?aspxerrorpath=/media/2036/icbusinessinsuranceblue-2x.png), these are both DEBUG level as we log everything. No information on the error itself.
I've set breakpoints in the code, and the code never gets to the S3 storage classes which leads me to believe the presence of the querystring values makes it struggle to identify the resource and errors somewhere. Forcing Visual Studio to throw all exceptions does nothing, so I can't pin down exactly where it's erroring out. I've tried putting breakpoints in code for redirects and what looks like image handling classes, but to no avail.
Has anyone seen this issue before and knows the cause of it, or any ideas where in the Umbraco core code it might be looking to identify the image and be throwing an error?
Ended up finding a solution for this in case anyone has a similar issue. This is unrelated to Articulate blog - it's an issue with query strings when using S3 storage and ImageProcessor.
(Solution copied and pasted from link above as well for reference below):
Yeah... You'll have to use the remote image service. ImageProcessor doesn't know Umbraco exists so can't tap into it's provider system... Unless you replaced the LocalFileImageService with your own Umbraco version.
That answer I gave is a bit old now and there's a better way. You should be able to use the CloudImageService now to load the images. That way you can keep your paths using the relative path. Here's how to set that up. Copied from the readme at https://github.com/ElijahGlover/Umbraco-S3-Provider
Using ImageProcessor (Recommended for Umbraco > 7.3.5)
Support for remote files has been added to ImageProcessor in version > 2.3.2. You'll also want to ensure that you are using Virtual Path Provider as ImageProcessor only hijacks requests when parameters are present in the querystring (like width, height, etc)
Install-Package ImageProcessor.Web.Config
Replace config file located ~/config/imageprocessor/security.config
Images with querystring using S3 storage throwing 500 error
We're using Umbraco.Storage.S3 (version 1.0.0) to host media files, which all works successfully. Umbraco version is 7.2.8
We recently installed the Articulate blog plugin, and when an image is chose to be the blog logo it adds on querystring parameters to the end of the image name when it saves it. e.g. /media/1007/cmf-3135-r-7-27-15.gif?mode=max&rnd=130996323070000000
The image loads fine without querystring values (and behind the scenes Umbraco pulls this file from S3). However, once querystring values are added for images, it redirects to the 500 page.
I've been trying to identify the source of the issue without any luck. There are no logs for the error itself - a log entry exists for the first URL request (/media/1007/cmf-3135-r-7-27-15.gif?mode=max&rnd=130996323070000000), followed immediately by the request for the 500 page (/error?aspxerrorpath=/media/2036/icbusinessinsuranceblue-2x.png), these are both DEBUG level as we log everything. No information on the error itself.
I've set breakpoints in the code, and the code never gets to the S3 storage classes which leads me to believe the presence of the querystring values makes it struggle to identify the resource and errors somewhere. Forcing Visual Studio to throw all exceptions does nothing, so I can't pin down exactly where it's erroring out. I've tried putting breakpoints in code for redirects and what looks like image handling classes, but to no avail.
Has anyone seen this issue before and knows the cause of it, or any ideas where in the Umbraco core code it might be looking to identify the image and be throwing an error?
Thanks.
Ended up finding a solution for this in case anyone has a similar issue. This is unrelated to Articulate blog - it's an issue with query strings when using S3 storage and ImageProcessor.
https://our.umbraco.org/projects/collaboration/imageprocessor/feedback-for-imageprocessor/64879-404-when-media-is-provided-by-a-VirtualPathProvider-(UmbracoStorageS3)#comment-219283
(Solution copied and pasted from link above as well for reference below):
Yeah... You'll have to use the remote image service. ImageProcessor doesn't know Umbraco exists so can't tap into it's provider system... Unless you replaced the LocalFileImageService with your own Umbraco version.
Config-wise the setup is simple though.
First install the additional configuration. Ensure also that Nuget installs the absolute latest of each library. https://www.nuget.org/packages/ImageProcessor.Web.Config/ You'll need to add your S3 bucket to the whitelist of allowable urls. http://imageprocessor.org/imageprocessor-web/configuration/#securityconfig
You don't have to be terrible specific with this url, just the domain should do it.
Now change your urls to match the syntax described here. http://imageprocessor.org/imageprocessor-web/imageprocessingmodule/#remote Let me know how you get on.
Incidentally there is an S3 cache provider for ImageProcessor on it's way soon so that you will be able to run everything in S3. https://github.com/JimBobSquarePants/ImageProcessor/pull/168
Hi Tony,
That answer I gave is a bit old now and there's a better way. You should be able to use the CloudImageService now to load the images. That way you can keep your paths using the relative path. Here's how to set that up. Copied from the readme at https://github.com/ElijahGlover/Umbraco-S3-Provider
Using ImageProcessor (Recommended for Umbraco > 7.3.5)
Support for remote files has been added to ImageProcessor in version > 2.3.2. You'll also want to ensure that you are using Virtual Path Provider as ImageProcessor only hijacks requests when parameters are present in the querystring (like width, height, etc)
Replace config file located
~/config/imageprocessor/security.config
Cheers
James
Hey James,
from the ElijahGlover nuget, do you know if we need to call any method to replace the url of the media or do we call them as it is with .GetCropUrl()?
Thanks
It's just an IFileSystemProvider so as long as you are using the virtual path provider functionality within it you should be fine.
is working on a reply...