<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Daniel Vigueras &#187; Desarrollo Web</title>
	<atom:link href="http://www.danielvigueras.com/c/desarrollo-web/feed" rel="self" type="application/rss+xml" />
	<link>http://www.danielvigueras.com</link>
	<description>Seguridad informática, redes y criptografía</description>
	<lastBuildDate>Sun, 24 May 2009 23:10:51 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Cómo evitar el Hotlinking y aprovecharnos de ello</title>
		<link>http://www.danielvigueras.com/desarrollo-web/como-evitar-el-hotlinking-y-aprovecharnos-de-ello</link>
		<comments>http://www.danielvigueras.com/desarrollo-web/como-evitar-el-hotlinking-y-aprovecharnos-de-ello#comments</comments>
		<pubDate>Sun, 30 Nov 2008 19:21:38 +0000</pubDate>
		<dc:creator>Daniel Vigueras</dc:creator>
				<category><![CDATA[Desarrollo Web]]></category>
		<category><![CDATA[apache]]></category>
		<category><![CDATA[GD]]></category>
		<category><![CDATA[hotlinking]]></category>
		<category><![CDATA[php]]></category>

		<guid isPermaLink="false">http://www.danielvigueras.com/?p=12</guid>
		<description><![CDATA[Los webmasters sufren a menudo lo que se denomina Hotlinking, es decir, otras páginas usan archivos (por ejemplo imágenes) alojados en su servidor directamente, haciendo que se consuma su ancho de banda. Lo correcto sería que la persona que quiera usar una imágen en tu web se la descargara a su disco duro y la [...]]]></description>
			<content:encoded><![CDATA[<p>Los webmasters sufren a menudo lo que se denomina <em><strong>Hotlinking</strong></em>, es decir, otras páginas usan archivos (por ejemplo imágenes) alojados en su servidor directamente, haciendo que se consuma su ancho de banda. Lo correcto sería que la persona que quiera usar una imágen en tu web se la descargara a su disco duro y la subiera posteriormente por FTP a su propia página, haciendo así que el ancho de banda gastado sea el propio y no el ajeno.</p>
<p>En varios blogs se pueden encontrar soluciones a este problema, un tanto radicales bajo mi punto de vista, que hacen que cuando un blog te enlace directamente una imágen esta sea sustituida por otra en tiempo de ejecución, o incluso que no se muestre nada, ahorrando así todo el ancho de banda.</p>
<p>Sin embargo si nos paramos a pensar un poco, lo que nos gustaría no es que nadie nos hiciera <em>hotlinking</em> de las imágenes, sino que ese blog acreditara en alguna parte que la imagen está extraída de nuestro blog. Como no podemos obligar al propietario del mismo a que nos enlace o nos nombre en algún sitio acerca de donde ha sido obtenida la imagen, vamos a aprovecharnos para incluir la URL de nuestro blog en la imagen enlazada, para ello haremos uso de los archivos <em>.htaccess</em> de <strong>Apache </strong>y de la librería <em><strong>GD </strong></em>de <strong>PHP</strong>. Lógicamente no queremos que las imágenes que incluyamos en nuestro blog tengan incrustada la URL del mismo.</p>
<p>La idea es simple, cuando un blog nos enlace una imágen directamente la petición GET llegará al servidor con un campo HTTP_REFERER que no corresponderá con la URL de nuestro blog, en ese momento se invocará un script PHP al cual le pasamos la ruta de la imagen solicitada. Este script PHP se encargá en tiempo real de abrir la imagen, incrustarle la URL de nuestro blog y mostrarla.</p>
<p>Este es un ejemplo de una imagen enlazada directamente por nuestro blog:</p>
<p><img class="aligncenter size-full wp-image-13" title="cd-security" src="http://www.danielvigueras.com/wp-content/uploads/2008/11/cd-security.png" alt="" width="340" height="370" /></p>
<p>Este es un ejemplo de como se mostraría la misma imagen si alguien nos hiciera <em>Hotlinking</em>:</p>
<p style="text-align: center;"><img class="size-full wp-image-14 aligncenter" title="cd-security2" src="http://www.danielvigueras.com/wp-content/uploads/2008/11/cd-security2.png" alt="" width="340" height="370" /></p>
<p>Para conseguir incluir este sistema en cualquier página web es necesario usar <strong>Apache</strong>, con soporte de archivos <em>.htaccess </em>y tener instalada la librería <em><strong>GD</strong> </em>en <strong>PHP.</strong></p>
<p>Paso 1: Editar el archivo .htaccess e incluir lo siguiente sustituyendo <strong>tudominio.com</strong> por tu dominio.</p>
<blockquote><p>RewriteEngine On<br />
RewriteCond %{HTTP_REFERER} !^http://(.+\.)?<strong>tudominio</strong>\.com/ [NC]<br />
RewriteCond %{HTTP_REFERER} !^$<br />
RewriteCond %{REQUEST_URI} .*\.(jpe?g|gif|bmp|png)$<br />
RewriteRule ^(.*)$ /nohotlink.php?i=$1 [L]</p></blockquote>
<p>Paso 2: Crear un archivo en el directorio raiz de la web denominado nohotlink.php e incluir el siguiente contenido, sustituyendo <strong>www.tudominio.com</strong> por tu dominio</p>
<blockquote><p>&lt;?php<br />
function imagecreatefromfile($path, $user_functions = false)<br />
{<br />
$info = @getimagesize($path);</p>
<p>if(!$info)<br />
{<br />
return false;<br />
}</p>
<p>$functions = array(<br />
IMAGETYPE_GIF =&gt; &#8216;imagecreatefromgif&#8217;,<br />
IMAGETYPE_JPEG =&gt; &#8216;imagecreatefromjpeg&#8217;,<br />
IMAGETYPE_PNG =&gt; &#8216;imagecreatefrompng&#8217;,<br />
IMAGETYPE_WBMP =&gt; &#8216;imagecreatefromwbmp&#8217;,<br />
IMAGETYPE_XBM =&gt; &#8216;imagecreatefromwxbm&#8217;,<br />
);</p>
<p>if($user_functions)<br />
{<br />
$functions[IMAGETYPE_BMP] = &#8216;imagecreatefrombmp&#8217;;<br />
}</p>
<p>if(!$functions[$info[2]])<br />
{<br />
return false;<br />
}</p>
<p>if(!function_exists($functions[$info[2]]))<br />
{<br />
return false;<br />
}</p>
<p>return $functions[$info[2]]($path);<br />
}</p>
<p>header(&#8220;Content-type: image/png&#8221;);<br />
$im        = imagecreatefromfile($_GET['i']);<br />
$width    = imagesx($im);<br />
$height    = imagesy($im);<br />
putenv(&#8216;GDFONTPATH=&#8217; . realpath(&#8216;.&#8217;));<br />
$white = imagecolorallocate($im, 255, 255, 255);<br />
$grey  = imagecolorallocate($im, 128, 128, 128);<br />
$black = imagecolorallocate($im, 0, 0, 0);<br />
$orange = imagecolorallocate($im, 220, 210, 60);<br />
$tamano = 10;<br />
$texto = &#8220;<strong>www.tudominio.com</strong>&#8220;;<br />
$tb = imagettfbbox($tamano, 0, &#8220;arial&#8221;, $texto);<br />
$altura = $tb[3] &#8211; $tb[5];<br />
imagefilledrectangle  ($im  , 0  , $height-$altura-2  , $width  , $height, $black);<br />
$x = ceil(($width &#8211; $tb[2]) / 2);<br />
imagettftext($im, $tamano, 0, $x, $height-4, $orange, &#8220;arial&#8221;, $texto);<br />
imagepng($im);<br />
imagedestroy($im);</p>
<p>?&gt;</p></blockquote>
<p>Paso 3: Descargar en el directorio raiz de vuestra web la fuente arial.ttf, la podeis obtener <a title="Arial" href="http://alxr.usatlas.bnl.gov/lxr/source/atlas/Tools/AtlasDoxygen/fonts/ttf/arial.ttf?raw=1">desde aqui</a>.</p>
<p>Y listo, ya tendríamos todo en funcionamiento. Podemos hacer una prueba de si el sistema funciona usando el siguiente comando desde wget:</p>
<blockquote><p>wget http://<strong>www.tudominio.com</strong>/alguna_imagen.jpg &#8211;referer=http://<strong>www.otrodominio.com</strong></p></blockquote>
]]></content:encoded>
			<wfw:commentRss>http://www.danielvigueras.com/desarrollo-web/como-evitar-el-hotlinking-y-aprovecharnos-de-ello/feed</wfw:commentRss>
		<slash:comments>19</slash:comments>
		</item>
	</channel>
</rss>
