skip to Main Content

We have a lot of images on Cloudinary that we are requesting using original URLs with the <img> tag, and we are trying to find a way to request these images with paramters, without changing any information in the database. For example, we have an image like this:

<img src="https://res.cloudinary.com/companyname/image/upload/nameofmyimage.jpg">

and when we request the image from Cloudinary, we would like it to request an image like:

<img src="https://res.cloudinary.com/companyname/image/upload/w_1920,c_limit/q_auto/nameofmyimage.jpg">

We could do global search and replaces, but the people actually working on the site wouldn’t know to put these parameters in the URL in the future; they just copy and paste the image URL from Cloudinary. Is there a way to use Nginx to rewrite or proxy these URLs to include parameters? I’ve tried three different ways below but non work.

#1

location = https://res.cloudinary.com/companyname/image/upload/(.*)/(.*)$ {
    return 301 https://res.cloudinary.com/companyname/image/upload/w_1920,c_limit/q_auto/$1/$2;
}

#3

rewrite https://res.cloudinary.com/companyname/image/upload/(.*)/(.*)$ http://res.cloudinary.com/companyname/image/upload/w_1920,c_limit/q_auto/$1/$2 last;

#2

rewrite ^/image/upload/(.*)/(.*)$ https://res.cloudinary.com/companyname/image/upload/w_1920,c_limit/q_auto/$1/$2 last;

2

Answers


  1. How do you generate the img tag?

    If you use one of Cloudinary’s SDKs for that then you can set the URL transformation upon the tag creation. You can check some Node examples here.

    Login or Signup to reply.
  2. add into location / { }

    sub_filter_types *;
    sub_filter_once off;
    sub_filter 'src="https://res.cloudinary.com/companyname/image/upload/' 'src="https://res.cloudinary.com/companyname/image/upload/w_1920,c_limit/q_auto/';
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search