imageprocessorgetcropurl problems - Using Umbraco 7

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Tobias Klika 101 posts 570 karma points c-trib

Dec 04, 2014 @ 22:54

0

ImageProcessor/GetCropUrl problems

Using Umbraco 7

Hi!

I have two questions regardingGetCropUrl. I am maintaining a huge product database in my project which is stored in Redis. These products have images, which are simply stored in the project folder and not as Media items in Umbraco!

GetCropUrl can be called for a string instead of the IPublishedContent, which is what I do for my images here.

Question 1
String.GetCropUrl does generate the correct image, but doesn't append the rnd parameter/hash. What is this parameter for? Cache busting?

Question 2
I really don't want to output image URIs like:
/media/products/nike-academy-14-polyesterjacke-9730.jpg?mode=pad&bgcolor=ffffff&quality=75&maxwidth=200&height=320
in my HTML. I want to rewrite this URL so it matches the given parameters and output a "nice URI" instead.

Something like: /media/products/nike-academy-14-polyesterjacke-9730-XXY.jpg where XXY is a short hash which is for the parameters.

Is this possible? Is there a module in Umbraco which can create nices URIs without query strings? And this shouldn't happen manually, as I have a minimum of 5k images in my project.

Thanks :)

Copy Link
Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib

Dec 04, 2014 @ 23:20

100

Hi Tobias,

Question 1 - yes client cache busting, it is a serialisation of the modified date so it onto changes when the content/media/member is updated. So for your static assets it's probably not needed or you could roll your own system.

Question 2 - this doesn't currently exist for ImageProcessor although I'm sure a module could be developed, or your own http module or you could consider presets perhaps...?

Hope that's useful?

Jeavon

Copy Link
Tobias Klika 101 posts 570 karma points c-trib

Dec 04, 2014 @ 23:31

0

Hi Jason.

First, thanks for you answer.

ad 1) Alright, than it's useless for these images. I will probably just append the modified date or something like this, so I have my own little cache buster.

ad 2) Sad. But Presets are a great starting point and will reduce these query strings a lot! I will think about an automated solution and see if I can develop something.

That was very useful, yes, thanks :)

Copy Link
James Jackson-South 489 posts 1747 karma points c-trib

Dec 05, 2014 @ 00:01

0

ImageProcessor already detects changes in input files so you shouldn't need a cachebuster.

As far as the second part goes... I'm all ears if you can figure something.

Copy Link
Tobias Klika 101 posts 570 karma points c-trib

Dec 05, 2014 @ 00:09

0

Pretty hard to get the Preset working, as ImageProcessor doesn't seem to recognize the presets :/ which I have added in config/imageprocessor/processing.config

And James, thanks for your explanation on the caching. It's true, I have tested it and it works! :)

Copy Link
James Jackson-South 489 posts 1747 karma points c-trib

Dec 05, 2014 @ 00:40

0

Yeah, I'm quite proud of that feature. :)

Can you post an example of what you have set up in the config and also a sample url?

Also, can you confirm what version of ImageProcessor.Web you are using?

Copy Link
Tobias Klika 101 posts 570 karma points c-trib

Dec 05, 2014 @ 00:53
0
:)

I have tested it with 3.3.1.0 (which was required by the Umbraco NuGet package) and 4.1.3.0.

Example URL: http://localhost:1380/media/products/nike-trophy-2-trikot-1-4-arm-3719.jpg?preset=productListing

Config in config/imageprocessor/processing.config:
```
<?xml version="1.0" encoding="utf-8" ?>
<processing>
  <plugins>
    <plugin name="Preset">
      <settings>
        <setting key="productListing" value="mode=pad&#038;bgcolor=ffffff&#038;quality=75&#038;maxwidth=200&#038;height=320" />
        ...
      </settings>
    </plugin>
  </plugins>
</processing>
```
Copy Link

James Jackson-South 489 posts 1747 karma points c-trib

Dec 05, 2014 @ 11:57

Ah, the syntax for your presets is wrong. You can see an example here

Presets aren't a plugin, rather they intercept the querystring and replace the key with the replacemant value.

In your case the configuration should begin with the following.

<?xml version="1.0" encoding="utf-8" ?>
  <processing preserveExifMetaData="false">
    <!-- Presets that allow you to reduce code in your markup. 
         Note the use of &#038; to escape ampersands. -->
    <presets>
    <!-- Instructions are imperative so you would apply the bgcolor after the resize. There's also no 'maxwidth' 
         instruction and the default resize mode is pad. -->
      <preset name="productListing" value="width=200&#038;height=320bgcolor=fff&#038;quality=75"/>
    </presets>
    <!-- List of plugins. -->
    <plugins autoloadplugins="true">

I would make sure you have a good look through the documentation for the available methods so you can get he best out of the system. It's a lot to take in but well worth the read :)

Copy Link

Tobias Klika 101 posts 570 karma points c-trib

Dec 07, 2014 @ 01:30

0

Thank you, James!

It didn't work, but the documentation says I have to install ImageProcessor.Web.Config and now it works perfectly ;)
I am already experimenting with rewriting the URL so I can create the image path with the query string. Hope I can pack this into a (my first) package :)

Thanks!

Copy Link
James Jackson-South 489 posts 1747 karma points c-trib

Dec 07, 2014 @ 22:26

0

Ah right, sorry, I was under the impression you had already installed the config package.

I'm very glad you managed to get it all working. Good luck writing the package! :)

Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?

ImageProcessor/GetCropUrl problems