Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
3.6k views
in Technique[技术] by (71.8m points)

laravel - .htaccess 404 error with webp conversion in October CMS plug-in

Having difficulties with a third-party plug-in ("ResponsiveImages") in October CMS. The plugin converts images to webp. Some images are converted while others - no. With some of them I'm getting error 404 code. Images are also not displayed in backend in Blog component.

if I try to access images directly - the No input file specified error is specified. system.log is empty.

I've added recommended rules by developer to .htaccess and now it looks like this:

<IfModule mod_rewrite.c>

    <IfModule mod_negotiation.c>
        Options -MultiViews
    </IfModule>

    RewriteEngine On
    
    ##
    ## You may need to uncomment the following line for some hosting environments,
    ## if you have installed to a subdirectory, enter the name here also.
    ##
     RewriteBase /
    
    ##
    ## Uncomment following lines to force HTTPS.
    ##
     RewriteCond %{HTTPS} off
     RewriteRule (.*) https://%{SERVER_NAME}/$1 [L,R=301]


    <IfModule mod_setenvif.c>
        # Vary: Accept for all the requests to jpeg and png
        SetEnvIf Request_URI ".(jpe?g|png)$" REQUEST_image
    </IfModule>


    # If the Browser supports WebP images, and the .webp file exists, use it.
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{REQUEST_URI} ^/?storage/.*.(jpe?g|png)
    RewriteCond %{REQUEST_FILENAME}.webp -f
    RewriteRule ^/?(.*)$ $1.webp [NC,T=image/webp,END]


    # If the Browser supports WebP images, and the .webp file does not exist, generate it.
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{REQUEST_URI} ^/?storage/.*.(jpe?g|png)
    RewriteCond %{REQUEST_FILENAME}.webp !-f
    RewriteRule ^/?(.*)$ plugins/offline/responsiveimages/webp.php?path=$1 [NC,END]
    
    <IfModule mod_headers.c>
        Header append Vary Accept env=REQUEST_image
    </IfModule>

    <IfModule mod_mime.c>
        AddType image/webp .webp
    </IfModule> 

    ##
    ## White listed folders
    ##
    RewriteCond %{REQUEST_FILENAME} -f
    RewriteCond %{REQUEST_URI} !^/plugins/vdlp/phast/phast.php*    
    RewriteCond %{REQUEST_FILENAME} !/.well-known/*
    RewriteCond %{REQUEST_FILENAME} !/storage/app/uploads/.*
    RewriteCond %{REQUEST_FILENAME} !/storage/app/media/.*
    RewriteCond %{REQUEST_FILENAME} !/storage/temp/public/.*
    RewriteCond %{REQUEST_FILENAME} !/themes/.*/(assets|resources)/.*
    RewriteCond %{REQUEST_FILENAME} !/plugins/.*/(assets|resources)/.*
    RewriteCond %{REQUEST_FILENAME} !/modules/.*/(assets|resources)/.*
    RewriteRule !^index.php index.php [L,NC]    

    ##
    ## Block all PHP files, except index
    ##
    RewriteCond %{REQUEST_FILENAME} -f
    RewriteCond %{REQUEST_URI} !^/plugins/vdlp/phast/phast.php*
    RewriteCond %{REQUEST_FILENAME} .php$
    RewriteRule !^index.php index.php [L,NC]

    ##
    ## Standard routes
    ##
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L] 
    
</IfModule>

If I remove this line RewriteRule ^/?(.*)$ plugins/offline/responsiveimages/webp.php?path=$1 [NC,END] - plug-in work is skipped and default images are displayed.

This is a one part of html where images are not displayed:

<div class="owl-item active" style="width: 264.8px;">
   <div>
      <div class="hero-item portfolio-item set-bg" data-setbg="https://www.website.com/storage/app/uploads/public/5ff/742/879/5ff7428794d80134665311.jpg" style="background-image: url(&quot;https://www.filmustudija.lt/storage/app/uploads/public/5ff/742/879/5ff7428794d80134665311.jpg&quot;); width: 321px; height: 321px;">
         <a href="https://www.website.com/post/post" class="hero-link">
            <h2>Heading</h2>
         </a>
      </div>
   </div>
</div>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can use this plugin to convert images to webp https://octobercms.com/plugin/toughdeveloper-imageresizer

{{ property.image | resize(500, false, { mode: 'crop', quality: '80', extension: 'webp' }) }}

or the standard method for the File model object getThumb()

{{ obModel.avatar.getThumb(500, false, { mode: 'crop', quality: '80', extension: 'webp' }) }}

should work out of the box


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...