How to force Apache to use manually pre-compressed gz file of CSS and JS files?
Asked Answered
G

6

38

I have simple question. I have webdirectory /css and inside is file style.css. I have manually gzipped this file and saved it as style.css.gz. I want to save CPU cycles to not have CSS file compressed at each request. How do I configure Apache to look for this .gz file and serve it instead of compressing .css file over and over again ?

Note: I don't want Apache to create .gz file itself. In my scenario I have to create .css.gz file manually - using PHP on specific requests.

Gaillardia answered 31/1, 2012 at 8:50 Comment(1)
I do something with PHP. On my CDN, Apache rewrites all js and css files requests to a php script which serves the compressed file if accepted by the browser or the minified file otherwise. It compares first the last modification time of both files (original & compressed), and only generates the compressed file if needed. If you use PHP and are interested I can paste it.Ducal
D
62

Some RewriteRule should handle that quite well.

In a Drupal configuration file I found:

# AddEncoding allows you to have certain browsers uncompress information on the fly.
AddEncoding gzip .gz

#Serve gzip compressed CSS files if they exist and the client accepts gzip.
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule ^(.*)\.css $1\.css\.gz [QSA]

# Serve gzip compressed JS files if they exist and the client accepts gzip.
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule ^(.*)\.js $1\.js\.gz [QSA]

# Serve correct content types, and prevent mod_deflate double gzip.
RewriteRule \.css\.gz$ - [T=text/css,E=no-gzip:1]
RewriteRule \.js\.gz$ - [T=text/javascript,E=no-gzip:1]

This will make the job. You can put that either in a <Directory foo/> section or in a .htaccess file if you do not have access to apache configuration or if you want to slowdown your webserver.

Daugavpils answered 6/2, 2012 at 9:54 Comment(5)
LOL - good comment about htaccess and slowing down webserver ;-)Gaillardia
I've set up your solution, however waiting times for delivering resources (JS+CSS) are still high 50 - 100 ms in average so I am supposing that Apache is not using these rules or something is wrong, because when serving static files the waiting time seen in Dev tools in Chrome should be smaller, right ?Gaillardia
check the request Accept-encoding is really gzip. The fact you may have several value in Accept-Encoding is maybe breaking it. Usually I use it with Varnish behind the server and this header is a simplier version of the variants: varnish-cache.org/trac/wiki/FAQ/… . try to match the Accept-Ending RewriteCond with the one you have (RewriteCond %{HTTP:Accept-encoding} gzip,deflate) to sse if it comes from that problemDaugavpils
Old answer but still very useful. In my case (1and1 hosting) I had to change the RewriteRules to RewriteRule ^(.*)\.css %{REQUEST_URI}\.gz [QSA] and RewriteRule ^(.*)\.js %{REQUEST_URI}\.gz [QSA]. Otherwise the server returned 404. Hope it helps somebody else.Disposal
Tried to do both .js and .json; ended up appending the $ end-of-string anchor on the Pattern side of RewriteRule: RewriteRule ^(.*)\.js$ $1\.js\.gz [QSA] ...otherwise the js rewrite caught the .json files and rewrote them to .js.gz rather than .json.gz.Entertainment
E
13

Continuing on regilero answer you should also add a few more lines in order to make sure the server answers with the corresponding Content-Encoding header:

#Serve gzip compressed CSS files if they exist and the client accepts gzip.
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule ^(.*)\.css $1\.css\.gz [QSA]

# Serve gzip compressed JS files if they exist and the client accepts gzip.
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule ^(.*)\.js $1\.js\.gz [QSA]

# Serve correct content types, and prevent mod_deflate double gzip.
RewriteRule \.css\.gz$ - [T=text/css,E=no-gzip:1,E=is_gzip:1]
RewriteRule \.js\.gz$ - [T=text/javascript,E=no-gzip:1,E=is_gzip:1]
Header set Content-Encoding "gzip" env=is_gzip
Empiric answered 22/5, 2014 at 14:10 Comment(2)
Thanks for this addendum, I first tried using regilero's solution, but the files were returned without the Content-Encoding header and thus failed to work right.Oersted
httpd.apache.org/docs/2.4/mod/mod_deflate.html#precompressed describes something similar. They also mention Header append Vary Accept-Encoding, too.Psychometrics
R
10

Rather than implementing content negotiation yourself using mod_rewrite (and missing out on more advanced features like q-values, status 406, TCN, etc.) you may want to use mod_negotiation as discussed in this question. Copying my answer from there:

Options +MultiViews
RemoveType .gz
AddEncoding gzip .gz
<FilesMatch ".+\.tar\.gz$">
    RemoveEncoding .gz
    # Note:  Can use application/x-gzip for backwards-compatibility
    AddType application/gzip .gz
</FilesMatch>

This has the added bonus of working for all .gz files rather than just .css.gz and .js.gz and being easily extended for additional encodings.

It does have one major drawback, since only requests for files which do not exist are negotiated a file named foo.js would make requests for /foo.js (but not /foo) return the uncompressed version. This can be avoided using François Marier's solution of renaming uncompressed files with a double extension, so foo.js is deployed as foo.js.js. If this restriction isn't too painful for your deployment process, using mod_negotiation may be worth considering.

Redden answered 21/1, 2016 at 19:5 Comment(3)
Apache will automatically add headers used by RewriteCond to Vary: If a HTTP header is used in a condition this header is added to the Vary header of the response. httpd.apache.org/docs/current/mod/mod_rewrite.html#rewritecond (see also "novary" flag)Ossein
Good catch @mems. You are quite right, I stand corrected. I've removed the incorrect statement about the Vary header not being set properly.Redden
This is the answer that worked for me. Thanks! Great solution!Kudu
T
7

I realise this isn't what you asked, but I'm throwing it out there anyway. Have you considered simply using mod_cache with mod_gzip? With the right configuration apache will gzip the files for you then pass the compressed cache files to clients and downstream proxies. This is way more efficient than what you propose in terms of time and effort and equally efficient in terms of bandwidth and computational load.

It doesn't matter that PHP has compressed the files first because with the right settings mod_gzip will detect that. The main point is you can cache compressed files and Apache won't recompress them.

Trucker answered 9/2, 2012 at 1:53 Comment(0)
B
3

Isn't this blog post exactly the step by step you were looking for ?

We check that this gzipped version of the file exists (fourth line), and if it does, we append .gz to the requested filename

Barcelona answered 7/2, 2012 at 10:15 Comment(3)
Yes, it looks very promising. But I am somewhat puzzled about Safari. The blog post is from 2007 and there is no more detail about Safari not working correctly with gzipped content. Is there any more detail about Safari and mainly if today's version works OK ?Gaillardia
I cannot believe Safari do not handle this correctly in 2012. However, I'll leave you check that :). There is a bit of info there : webmasters.stackexchange.com/questions/22217/…Barcelona
And it appears to me that the rules are quite the same regilero mentionned first.Barcelona
F
3

I was struggling slightly with the proposed solution. For anyone else using VirtualHosts with different DocumentRoots you simply have to change the RewriteCond to:

RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME}\.gz -s
Floribunda answered 27/9, 2019 at 12:13 Comment(2)
you are a genius. I was trying to serve pre-compressed content from my site's virtual host but couldn't; it would only work on the .htaccess file. Adding %{DOCUMENT_ROOT} to my RewriteCond was the key. Thank you so much.Cartwheel
Yes you are a genius. There was no hint from Apache. The configuration looked fine but it was just not working until I added DOCUMENT_ROOTOblate

© 2022 - 2024 — McMap. All rights reserved.