Sitecore 7.5 Image resizing changes

I am sure a few people already know about this but I just wanted to put it out there in case some f us are looking for it:

From Sitecore 7.5, the Image resizing is not working the way it was.

On previous version of Sitecore you would have been familiar with the resizing, passing the parameters in the URL:

http://mywebsite/~/media/imagesample.ashx?w=150
This will output the resized version of the image with a width of 150px. The usual parameters used for resizing are:

w = Width (in pixels)
h = Height (in pixels)
mw = MaxWidth (pixels)
mh = MaxHeight (pixels)
bc = Background Color
sc = Scale (floating point)
thn = Display as thumbnail

Well, as this was still the case in 7.2, I assumed it would be the same in 7.5... and obviously it id not... My bad as I did not read the release notes for this version. Thanks to Sitecore support who pointed me to the link... Here is the abstract that relates to the issue:

Media request protection

• The new media request protection feature restricts media URLs that contain dynamic image-scaling parameters so that only server-generated requests are processed. This ensures that the server only spends resources and disk space on valid image scaling requests.

• Sitecore Corp. wants to give credit to Cognifide (Adam Najmanowicz and Marek Musielak, www.cognifide.com) for the discovery of this vulnerability, for their cooperation and providing the initial ImageGuard solution.

• When the feature is enabled, Sitecore automatically signs image URLs that are rendered by the <renderField> pipeline and adds a hash value to the query string. When processing an incoming media request, image resizing/scaling is skipped if any of the relevant query string parameters in the image URL have been altered or any extra resizing parameters have been appended to the URL. In these cases, Sitecore returns the original, unaltered image. Requests for the original image (without any resizing/scaling parameters) work as usual and are not restricted.

• If you have code in your solution that manually appends image scaling parameters to image URLs without passing the parameters to the <sc:image> control, you must rewrite the code to append a hash value using one of the helper methods or rewrite it to use the <sc:image> control. In XSLT renderings, you can use sc:SignMediaUrl(url) or sc:GetSignedMediaUrl(…). In C# code, you can use HashingUtils.ProtectAssetUrl(url) which appends a hash value to the provided URL, or you can use GetAssetUrlHash(url) to only return the hash value for the provided URL.

• You must ensure that any static image URLs (for example, in CSS or aspx files) that contain image scaling parameters are updated to include the corresponding hash value. To make it easy to update these type of static URLs, a new /sitecore/admin/MediaHash.aspx is available, which lets you enter a media URL and, with the click of a button, generate the corresponding hash value.

• Image URLs where resizing parameters are manipulated or added using JavaScript will no longer work because you cannot calculate the hash values from JavaScript. If you need this type of functionality, you will have to find a different approach, such as implementing a service that can calculate the correct hash value.

• This feature is configured in the /App_Config/Include/Sitecore.Media.RequestProtection.config file.

So if like me you used to pass the width o height in the URL, then you may have to revisit a few view rendering to ensure that you are now passing the Hash value.

So if you have a Model (Glass Map) like the following

using System;
using MyProject.Common.Constants;
using MyProject.Dal.Models.Base;
using Glass.Mapper.Sc.Configuration.Attributes;
using Glass.Mapper.Sc.Fields;

namespace MyProject.Models.ImageCarousel
{
    [SitecoreType(TemplateId = TemplateIds.DataElements.CarouselImage, AutoMap = true)]
    public class CarouselImage : SitecoreBase
    {
        [SitecoreField(FieldId = FieldIds.DataElements.CarouselImage.ImageBanner)]
        public virtual Image ImageBanner { get; set; }

        [SitecoreField(FieldId = FieldIds.DataElements.CarouselImage.DestinationUrl)]
        public virtual Link DestinationUrl { get; set; }

        [SitecoreField(FieldId = FieldIds.DataElements.CarouselImage.Description)]
        public virtual string Description { get; set; }
    }
}

Then you will be able to update your cshtml view to use:

        < img src="@Sitecore.Resources.Media.HashingUtils.ProtectAssetUrl(string.Format("{0}?w=150", Model.imagebanner.src))"  />