.htaccess Examples

This tutorial shows an example of how a .htaccess file should look like when you need to enable GZip, allow using CDN with webfonts, and set custom expiry headers. You can also check out the magnificent .htaccess file included with HTML5 BoilerPlate.

This should all be at the very top of your .htaccess file. If you already have the lines listed under Section 1, you need to remove them.

The .htaccess file can also be used to define a list of "cacheable items" For example, set anything that is not png, jpg, gif, css, js to no cache. This way, if you ever serve your full domain through CDN, only certain files will be cached. Please note that using a full domain www.domain.com as a CDN URL is only available to Enterprise/Contract clients.

Examples

############################################################################################
#Section 1
RewriteEngine On
IndexIgnore *
Options +FollowSymLinks -Multiviews -Indexes
############################################################################################
# ----------------------------------------------------------------------
# CORS-enabled images (@crossorigin)
# ----------------------------------------------------------------------
# Send CORS headers if browsers request them; enabled by default for images.
# developer.mozilla.org/en/CORS_Enabled_Image
# blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html
# hacks.mozilla.org/2011/11/using-cors-to-load-webgl-textures-from-cross-domain-images/
# wiki.mozilla.org/Security/Reviews/crossoriginAttribute
<IfModule mod_setenvif.c>
  <IfModule mod_headers.c>
    # mod_headers, y u no match by Content-Type?!
    <FilesMatch "\.(gif|png|jpe?g|svg|svgz|ico|webp)$">
      SetEnvIf Origin ":" IS_CORS
      Header set Access-Control-Allow-Origin "*" env=IS_CORS
    </FilesMatch>
  </IfModule>
</IfModule>
# ----------------------------------------------------------------------
# Webfont access
# ----------------------------------------------------------------------
# Allow access from all domains for webfonts.
# Alternatively you could only whitelist your
# subdomains like "subdomain.example.com".
<IfModule mod_headers.c>
  <FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css|css)$">
    Header set Access-Control-Allow-Origin "*"
  </FilesMatch>
</IfModule>
############################################################################################
RewriteCond %{QUERY_STRING} base64_encode.*\(.*\) [OR]
RewriteCond %{QUERY_STRING} (\<|%3C).*script.*(\>|%3E) [NC,OR]
RewriteCond %{QUERY_STRING} GLOBALS(=|\[|\%[0-9A-Z]{0,2}) [OR]
RewriteCond %{QUERY_STRING} _REQUEST(=|\[|\%[0-9A-Z]{0,2})
RewriteRule ^(.*)$ index.php [F,L]
############################################################################################
# Deflate files to fasten the loading
<IfModule mod_deflate.c>
    SetOutputFilter DEFLATE
    AddOutputFilterByType DEFLATE application/x-httpd-php text/html text/xml text/plain text/css text/javascript application/javascript application/x-javascript image/jpeg image/jpg image/png image/gif font/ttf font/eot font/otf
</IfModule>
<IfModule mod_headers.c>
    # properly handle requests coming from behind proxies
    Header append Vary User-Agent
</IfModule>
<IfModule mod_deflate.c>
    # Properly handle old browsers that do not support compression
    BrowserMatch ^Mozilla/4 gzip-only-text/html
    BrowserMatch ^Mozilla/4\.0[678] no-gzip
    BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
    # Explicitly exclude binary files from compression just in case
    SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|pdf|swf|ico|zip|ttf|eot|svg)$ no-gzip
</IfModule>
############################################################################################
# Protect .htaccess
<Files .htaccess>
        order allow,deny
        deny from all
</Files>
############################################################################################
# Header Expiry
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|webp|swf)(\.gz)?(\?.*)?$">
        Header set Expires "Thu, 23 Aug 2222 00:00:00 GMT"
        Header unset ETag
        FileETag None
</FilesMatch>
###########################################################################################

As always, If you have any questions or concerns about any of the topics mentioned in this article, please feel free to reach out to support - we are available 24/7 by chat or email.