0

So regular, webp conditional loading works:

 map $http_accept $webp_suffix {
     default "";
     "~*webp" ".webp";
  }

with small exception of pulling out of svg to separate location (otherwise there was xml parsing error in browser) and creating additional variable to persist $webp_suffix value

    location ~* \.(svg|svgz)$ {
        add_header Cache-Control "public";
        add_header X-Frame-Options "SAMEORIGIN";
        expires +1y;
        try_files $uri $uri/ /get.php$is_args$args;
    }
    location ~* \.(ico|jpg|jpeg|png|gif|webp|avif|avifs|js|css|eot|ttf|otf|woff|woff2)$ {
        add_header Cache-Control "public";
        add_header X-Frame-Options "SAMEORIGIN";
        expires +1y;
        add_header Vary Accept;
        set $webpvar $webp_suffix;
        try_files $uri$webpvar $uri$webpvar/ /get.php$is_args$args;
    }

But after enabling offloaded to Nginx images resizing:

location ~* \.(jpg|jpeg|png|gif|webp)$ {
    set $width "-";
    set $height "-";
    if ($arg_width != '') {
        set $width $arg_width;
    }
    if ($arg_height != '') {
        set $height $arg_height;
    }
    image_filter resize $width $height;
    image_filter_webp_quality 90;
    image_filter_jpeg_quality 90;
}

There's no more conditional webp loading because of image_filtr module takes original $uri as input. I've been trying to rewrite or redirect uri but either I end up with a loop and/or with webp being loaded as text/html with following code:

if ($uri !~* /media/(.*)(?:^|\W)webp(?:$|\W)) {
   set $webpmediacheck 1;
 }
if ($uri ~* /media/(.*)(?:^|\W)jpg|jpeg|png(?:$|\W)) {
   set $webpmediacheck 1$webpmediacheck;
 }
if ($webp_suffix = ".webp") {
   set $webpmediacheck 1$webpmediacheck;
 }
if ($webpmediacheck = 111) {
       return 302 $scheme://$host$uri$webp_suffix$is_args$args;
 }

Is there any smart way to achieve conditional webp loading and resizing?

1 Answer 1

0

Following seems to work quite well:

 set $webpmediacheck '';
 set $webpvar $webp_suffix;
if ($uri !~* /media/(?:.+)(\.webp)(?:$|\W)) {
  set $webpmediacheck 1;
}
if ($uri ~* /media/(?:.+)(\.jpe?g|\.png)(?:$|\W)) {
  set $webpmediacheck 1$webpmediacheck;
}
if ($webpvar = ".webp") {
   set $webpmediacheck 1$webpmediacheck;
}
if ($webpmediacheck = 111) {
      rewrite (.+)(\.jpe?g|\.png)($|\W) $1$2$webpvar$3 break;
}

location /media/ {....

Unless there's something more clever or performant?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.