Herramientas Publicaciones

Controla tu sitio web en Apache con .htaccess

By Federico GuzmanPosted on
Time to Read:-words

Crear un sitio o una aplicación web es “sencillo”, lo difícil es hacer que funcione correctamente y que tenga seguridad para proteger tu trabajo y la información de tu cliente, htaccess te puede ayudar. Por lo general, cuando configuramos un nuevo sitio web dejamos que el servidor o hosting maneje los parámetros de seguridad y optimización como viene de “fábrica” por decir la configuración general básica.

Si tienes acceso a el archivo httpd o archivo de configuración principal de tu servidor, úsalo, aprovecha al máximo todo lo que te provee tu servidor. No  sólo mejoras el desempeño de tu sitio web, sino también la seguridad.

Si tienes un shared hosting o un servicio al cual no puedes tener acceso a tu archivo de configuración de Apache httpd, entonces, utiliza .htaccess.

Evita usar .htaccess en tus proyectos si tienes acceso a httpd ya que reduce el desempeño del servidor, de lo contrario, aquí algunos tips para mejorar tu proyecto y darle un poco más de seguridad utilizando un archivo .htaccess. Recuerda que este archivo debe estar en la raíz de documentos de tu servidor web:

1.  Página Error 404 personalizada

# ----------------------------------------------------------------------
# Custom 404 page
# ----------------------------------------------------------------------
ErrorDocument 404 /404.html

2. Codificación UTF-8 para todos tus documentos txt y html

# ----------------------------------------------------------------------
# UTF-8 encoding
# ----------------------------------------------------------------------
AddDefaultCharset utf-8

Para otros formatos de archivos puedes utilizar

AddCharset utf-8 .css .js .xml .json .rss .atom

3. Evitar hostname redundantes, principalmente para Google Analytics.
No lo utilices si tienes subdominios públicos, ejemplo: http://cuenta.tusitio.com.

Esto hace que las visitas a http://tusitio.com sean redirigidos a http://www.tusitio.com

<IfModule mod_rewrite.c>
 RewriteCond %{HTTPS} !=on
 RewriteCond %{HTTP_HOST} !^www\..+$ [NC]
 RewriteRule ^ http://www.%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

De lo contrario si quieres hacerlo a la inversa: http://www.tusitio.com hacia http://tusitio.com

<IfModule mod_rewrite.c>
 RewriteCond %{HTTPS} !=on
 RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
 RewriteRule ^ http://%1%{REQUEST_URI} [R=301,L]
</IfModule>

4. Cabecera de expiración para mejorar el control de cache, esencial para SEO

<IfModule mod_expires.c>
 ExpiresActive on

# Perhaps better to whitelist expires rules? Perhaps.
 ExpiresDefault "access plus 1 month"

# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
 ExpiresByType text/cache-manifest "access plus 0 seconds"

# Your document html
 ExpiresByType text/html "access plus 0 seconds"

# Data
 ExpiresByType text/xml "access plus 0 seconds"
 ExpiresByType application/xml "access plus 0 seconds"
 ExpiresByType application/json "access plus 0 seconds"

# Feed
 ExpiresByType application/rss+xml "access plus 1 hour"
 ExpiresByType application/atom+xml "access plus 1 hour"

# Favicon (cannot be renamed)
 ExpiresByType image/x-icon "access plus 1 week"

# Media: images, video, audio
 ExpiresByType image/gif "access plus 1 month"
 ExpiresByType image/png "access plus 1 month"
 ExpiresByType image/jpg "access plus 1 month"
 ExpiresByType image/jpeg "access plus 1 month"
 ExpiresByType video/ogg "access plus 1 month"
 ExpiresByType audio/ogg "access plus 1 month"
 ExpiresByType video/mp4 "access plus 1 month"
 ExpiresByType video/webm "access plus 1 month"

# HTC files (css3pie)
 ExpiresByType text/x-component "access plus 1 month"

# Webfonts
 ExpiresByType application/x-font-ttf "access plus 1 month"
 ExpiresByType font/opentype "access plus 1 month"
 ExpiresByType application/x-font-woff "access plus 1 month"
 ExpiresByType image/svg+xml "access plus 1 month"
 ExpiresByType application/vnd.ms-fontobject "access plus 1 month"

# CSS and JavaScript
 ExpiresByType text/css "access plus 1 year"
 ExpiresByType application/javascript "access plus 1 year"

</IfModule>

5. Habilitar CORS o consultas ajax Cross-domain

<IfModule mod_headers.c>
 Header set Access-Control-Allow-Origin "*"
</IfModule>

6. Mejorar la experiencia para usuarios con IE
Esto obliga a utilizar la versión mas reciente de IE, por ejemplo cuando acceden al sitio desde IE7 o menor :S

<IfModule mod_headers.c>
 Header set X-UA-Compatible "IE=Edge,chrome=1"
 # mod_headers can't match by content-type, but we don't want to send this header on *everything*...
 <FilesMatch "\.(js|css|gif|png|jpe?g|pdf|xml|oga|ogg|m4a|ogv|mp4|m4v|webm|svg|svgz|eot|ttf|otf|woff|ico|webp|appcache|manifest|htc|crx|oex|xpi|safariextz|vcf)$" >
 Header unset X-UA-Compatible
 </FilesMatch>
</IfModule>

7. Comprimir contenido con Gzip

<IfModule mod_deflate.c>

 # Force deflate for mangled headers developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/
 <IfModule mod_setenvif.c>
 <IfModule mod_headers.c>
 SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
 RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
 </IfModule>
 </IfModule>

 # HTML, TXT, CSS, JavaScript, JSON, XML, HTC:
 <IfModule filter_module>
 FilterDeclare COMPRESS
 FilterProvider COMPRESS DEFLATE resp=Content-Type $text/html
 FilterProvider COMPRESS DEFLATE resp=Content-Type $text/css
 FilterProvider COMPRESS DEFLATE resp=Content-Type $text/plain
 FilterProvider COMPRESS DEFLATE resp=Content-Type $text/xml
 FilterProvider COMPRESS DEFLATE resp=Content-Type $text/x-component
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/javascript
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/json
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xml
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xhtml+xml
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/rss+xml
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/atom+xml
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/vnd.ms-fontobject
 FilterProvider COMPRESS DEFLATE resp=Content-Type $image/svg+xml
 FilterProvider COMPRESS DEFLATE resp=Content-Type $image/x-icon
 FilterProvider COMPRESS DEFLATE resp=Content-Type $application/x-font-ttf
 FilterProvider COMPRESS DEFLATE resp=Content-Type $font/opentype
 FilterChain COMPRESS
 FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no
 </IfModule>

 <IfModule !mod_filter.c>
 # Legacy versions of Apache
 AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
 AddOutputFilterByType DEFLATE application/javascript
 AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
 AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml
 AddOutputFilterByType DEFLATE image/x-icon image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype
 </IfModule>

</IfModule>

8. Activar el MOD Rewrite

<IfModule mod_rewrite.c>
 Options +FollowSymlinks
 RewriteEngine On
</IfModule>

o simplemente

RewriteEngine On

9. Bloquear acceso a archivos de backup y archivos fuente

<FilesMatch "(\.(bak|config|sql|fla|psd|ini|log|sh|inc|swp|dist)|~)$">
 Order allow,deny
 Deny from all
 Satisfy All
</FilesMatch>

10. Evitar que los usuarios vean los directorios sin documento predeterminado (index.html)

<IfModule mod_autoindex.c>
 Options -Indexes
</IfModule>

11. Bloquear acceso a los directorios que empiezan con un punto como carpetas Git

<IfModule mod_rewrite.c>
 RewriteCond %{SCRIPT_FILENAME} -d
 RewriteCond %{SCRIPT_FILENAME} -f
 RewriteRule "(^|/)\." - [F]
</IfModule>