Images not being converted on the fly on nginx server

Hi,

Yes, you can look at the response headers for the request. Open up the network tab in dev tools and click on the request and look at the response headers. If the response comes from the script, it will have a “X-WebP-Convert-Log” header

Hi,

Thanks for your quick reply, I appreciate it.

When I request a non-converted image, it indeed shows the headers you mentioned and gets converted correctly. However, images requested from CSS files are still not being redirected. I have applied the following rules to my server:

# WebP Express rules
# --------------------
location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
  add_header Vary Accept;
  expires 365d;
  if ($http_accept !~* "webp"){
    break;
  }
  try_files
    /wp-content/webp-express/webp-images/doc-root/$uri.webp
    $uri.webp
    /wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
    ;
}

# Route requests for non-existing webps to the converter
location ~* ^/?wp-content/.*\.(png|jpe?g)\.webp$ {
    try_files
      $uri
      /wp-content/plugins/webp-express/wod/webp-realizer.php?xdestination=x$request_filename&wp-content=wp-content
      ;
}
# ------------------- (WebP Express rules ends here)

I have also applied the settings suggested with this configuration.

Do you maybe have any other suggestions on what I could try?

Sounds strange. In this context, it should not matter if the image is requested from HTML or CSS. Perhaps it has to do with the location of the images referenced from within the CSS? Does referencing an image in the uploads folder from within CSS work?

Unfortunately referencing the images from the uploads folder doesn’t change anything. All images in the HTML are referenced as webp, yet no images from the CSS are.

Here’s a screenshot of my settings: https://i.imgur.com/RZ2IojB.png

I see that you have enabled Alter HTML. This is probably why you only experience problems with images referenced from CSS. I’m guessing that the rewriting doesn’t work at all. You can test the rewriting by clicking the “Live test” buttons (the test also works, even though you are on Nginx)

Yeah, that was my thought as well. Live testing indeed fails. I’m going to contact my server admin about this. Thanks.

Closing issue, feel free to reopen if neccessary…

@bartkleinreesink hi, could you help me?

Could you send me the correct rules?

Enable direct redirection to existing converted images? – Failed
Enable redirection to converter? – Done
Create webp files upon request? – Done

I can’t find the mistake =(

All FAQ rules doesn’t work.

I have this:

# WebP Express rules
# --------------------
location ~* ^/wp-content/.*\.(?i)(png|jpe?g)$ {
    add_header vary accept;
    expires 365d;
    }
location ~* ^/wp-content/.*\.webp$ {
    expires 365d;
    if ($whattodo = AB) {
        add_header vary accept;
        }
    }
    if ($http_accept ~* "webp"){
    set $whattodo A;
    }
    if (-f $request_filename.webp) {
        set $whattodo  "${whattodo}B";
    }
    if ($whattodo = AB) {
    rewrite ^(.*) $1.webp last;
    }
    if ($whattodo = A) {
        rewrite ^/wp-content/.*\.(?i)(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?wp-content=wp-content break;
    }
# ------------------- (WebP Express rules ends here)

• This reply was modified 4 years ago by korotkow.