http://martin.com.uy/wp-content/themes/martinuy2/live/proxy.php?url_especifica=
0
11
Apr
2008

¿Cómo agregar el Estado del Tiempo a tu sitio web?

tiempoSupongamos que queremos mostrar en nuestra página información sobre el Estado del Tiempo. Evidentemente nosotros no vamos a estar actualizando a cada instante los valores. Necesitamos sacarla de algún lugar donde eso suceda automáticamente. Hay distintas formas: utilizar algún sitio que nos permita insertar su código (The Weather Channel por ejemplo), utilizar un iframe o lo que les voy a contar a continuación.

PHP nos permite leer archivos de texto de forma local (en la misma computadora donde se ejecuta el script) y de forma remota (cualquier sitio web por ejemplo). La técnica es la siguiente: en cada ejecución del script leemos el HTML de alguna página, de allí extraemos la información que necesitamos y la presentamos como queremos.

La ventaja de esto muy clara: podemos elegir que información mostrar, integrarla a nuestro diseño y no tendremos que soportar publicidad de ningún tipo.

El ejemplo será con el Estado del Tiempo y la víctima de nuestro “robo” Buquebus. Podría aplicarse la misma idea para casi cualquier sitio e información. Otro ejemplo que se me ocurre de similares características es la cotización de la moneda.

Hay una cuestión básica en esto y es que cada página es diferente. Eso significa que no hay un algoritmo genérico: debemos estudiar a la víctima (cómo presenta la información, dónde está esa información y cómo varía en cada actualización del sitio) y en función de eso diseñar el código.

En este caso, Buquebus tiene una marquecina en la parte superior central donde corre el Estado del Tiempo de Buenos Aires, Colonia, Montevideo y Punta del Este. Si analizamos el código vemos que:

  • Las ciudades se presentan siempre en el mismo órden: 1. BsAs, 2. Col, 3. Montevideo y 4. Punta.
  • La información de cada ciudad también sigue un órden: 1. imágen, 2. temperatura y 3. descripción.
  • Las imágenes están en la carpeta clima_up y la carpeta clima_up aparece en el código solamente cuando hay una imágen del tiempo. Ergo, la carpeta clima_up aparece 4 y solo 4 veces en el código: una vez por cada ciudad.

Concluímos que si bien el contenido de la página es muy dinámico, hay algunas referencias fijas. De esas referencias nos vamos a valer para ir directamente a donde precisamos, siendo lo suficientemente flexibles para recabar la información sin saber su largo.

Ahora vamos a ensuciarnos las manos con el código:

$nombre_archivo = “http://www.buquebus.com/cache/HomeARG.html”;
$archivo = fopen($nombre_archivo, rb);
$texto_archivo = stream_get_contents($archivo);

Lo primero es la dirección dónde está el archivo de texto (html en este caso).
Lo segundo es la función que nos abre ese archivo.
La tercera variable, $texto_archivo, es un string (una cadena de caracteres) con todo el código html de la página. De esa cadena justamente vamos a sacar lo que precisamos.

Ahora buscamos la posición de la primera aparición de la cadena clima_up. Sabemos que la información a continuación corresponde a Buenos Aires -por lo que decía del órden anteriormente-, que el próximo caracter será un “/” y que en los siguientes vendrá el nombre de la imágen. Ese nombre de la imágen puede tener cualquier largo pero cuando lleguemos al caracter ” (comillas) se terminó. Esto se traduce en lo siguiente:

$bueno_aires_imagen = “”;
$buenos_aires_numero = strpos($texto_archivo, “clima_up”);
$buenos_aires_numero += 8; //adelantamos 8 posiciones, correspondientes a “c l i m a _ u p /” para llegar a donde comienza el nombre del archivo.
do {
$buenos_aires_numero += 1;
$bueno_aires_imagen .= $texto_archivo[$buenos_aires_numero];
}
while($texto_archivo[$buenos_aires_numero + 1] != \“); //Vamos agregando a la variable con el nombre los caracteres siguientes hasta que lleguemos al caracter comillas.

$buenos_aires_imagen contendría algo así como “nublado.gif”.

Para la temperatura, siguiente dato, hacemos algo similar:

$buenos_aires_numero += 8; //Adelantamos los caracteres ‘ > & n b s p ; ‘ y quedamos prontos para recibir la temperatura.
$buenos_aires_temperatura = “”;
do {
$buenos_aires_numero += 1;
$buenos_aires_temperatura .= $texto_archivo[$buenos_aires_numero];
}
while($texto_archivo[$buenos_aires_numero + 1] != “&”);

$buenos_aires_temperatura es otro string con los grados.

La descripción de la imágen (“Mayormente Nublado”, “Soleado”, “Nublado”, etc.) la armamos con una pequeña función dónde ingresamos el nombre del archivo y nos devuelve el texto. Esto se puede hacer porque a cada nombre de archivo corresponde una y una sola descricpión.

Hasta aquí tendríamos Buenos Aires. Para conseguir el resto de las ciudades aplicamos el mismo proceso con la diferencia que al buscar la carpeta clima_up fijamos un número de caracter a partir del cuál hacer la búsqueda. Ese número de caracter será cualquiera inmediatamente posterior al de Buenos Aires. En mi caso puse $buenos_aires_numero que ya estaba suficientemente adelantado. Me quedó así: $colonia_numero = strpos($texto_archivo, “clima_up”, $buenos_aires_numero);

Cómo presentan la información es problema de ustedes ;) No olviden mis tutoriales anteriores sobre PHP y HTML (aquí y aquí).

Un ejemplito de lo que hice yo: http://martin.com.uy/sitio/tiempo/tiempo.php (las descripciones no están completas un poco por vago y otro poco porque no las ví en el sitio de Buquebus).

A las órdenes por consultas.

PD: Amigos de Buquebus: no se me ofendan y no cambien el código de la página. Gracias. jajaja!!

11
Apr
2008

Uhhh los amigos de buquebus deben estar re contentos con esto!!!
Jajajaja y ni te cuento los programadores…

Lastima que de php no se nada, pero lo tengo pensado estudiar para algun futuro (espero no muy lejano)

11
Apr
2008

Muy lindo/útil hack Martin :D

Como sugerencia, podrías agregarle alguna especie de caché así no hace la petición por cada visitante/click tengas.

Saludos!

-
Daniel

11
Apr
2008

viste que esto del clima es muy cambiante, no? (?) jajaj :lol:

Igual es bastante light de recursos. Lo que capaz que le agrego después (muy después) es una coordinación con la hora; es medio loco que sean las 00:30 y en Colonia haya terrible sol jajaja

14
Apr
2008

Muy bueno!
Se puede agregar como widget en un blog de wordpress?

Beso

14
Apr
2008

Sí, no hay problema Fiore. Para usarlo como Widget en WordPress tenes que agregar un Widget de texto e insertar el código HTML que te voy a pasar (te lo paso por mail porque si lo pongo acá no se va a ver). Si alguien más lo quiere, que me lo pida.

23
Apr
2008

Más fácil llevarte un iframe entero. ;)

23
Apr
2008

Ah, esto me saca el HTML. :D

“”

A ver ahora…

23
Apr
2008

Bueno, no se pudo.

PD: Es “LloviZnas” no “LloviSnas”

23
Apr
2008

Creo que lo copié textual.. jaja después lo acomodo, inclusive hay otros que no los copié.

Lo del iframe es una posibilidad -los comentarios aquí no lo aceptan jaja-, el problema es que estás atado en cuanto a la personalización. Lo bueno de hacer un script es que vos después decidís como presentar la información.

Saludos,
martin.-

28
Jun
2008

martin muy buna el blog.
me podrias mandar el codigo por mail, es q no se mucho de php y voy a tratar copiar y pegar el mismo
graciasssssss

29
Jun
2008

Nico, si querés usá el iframe de mi página, no hay problema!

Saludos,
martin.-

22
Oct
2008

Hola soy de Concordia Entre Ríos Argentina,mirá estoy haciendo un sitio y quiero agregarle la información del clima y me gustaría que sea de The Weather Channel,me podrías explicar en un mail o enviarme el ejemplo de como hacerlo,el tema es que soy bastante novato en esto,por no decir que no se nada. Muchas gracias. José.

23
Oct
2008
samtarem

Hola, Me interesa mucho aprender sobre este asunto, El caso es que soy novato total, y copiando tu codigo para mostrar el tiempo de buquebus pues no consigo mas que errores, me podrias enviar un archivo php preparado para ver donde meto la pata, yo te escribo desde España, y no me sirve el tiempo de esta pagina, pero podria intentar adaptarlo al aemet que es la agencia meteorologica de España
Un saludo y gracias

26
Oct
2008

Te respondo por mail.

28
Nov
2008
andres

hola martin
antes que nada felicidades por tu pagina
yo no entiendo mucho en programacion lo hago es de atrevido y me interesa lo del clima en mi sitio pero en html
me lo podrias pasar como seria
desde ya gracias y muchas felicidades en estas fiesta

20
Dec
2008
ignacio

Me podrías pasar el archivo a mi tambien? muchas gracias!

4
Jan
2009

Gente, en el artículo están explicadas las funciones y el código PHP necesario para aplicarlo a cualquier página!

Por cualquier duda específica estoy a las órdenes para responder.

Saludos,
martin.-

5
Jan
2009
mozky

Pa loco fenomenal tu blog, te felicito, seria mucha joda si te pido publiques el ejemplo de nuevo, noy azul en php y me gustaria copiartelo :D .. feliz año y saludos

29
Jan
2009
Nazly

Hola, que tal… soy de Mexico, me interesa mucho hacer lo msimo que tu del estado del tiempo, pero con informacion de mi pais y mis ciudades (Yucatan, Campeche, Quintana Roo y tal vez Tabasco)… sabes de algun sitio similar al buquebus?

Gracias!

30
Jan
2009
Luciano Montenegro

Martin, Felicitaciones por los comentarios,
que dicho sea de paso, no estan para nada demás!!! muy bueno tu laburo…
Ahora si, paso a pedirte =P
Vi este tuto y la verdad que me intereso bastante, pero no soy un “empapado” en php (por el momento)…
Queria saber (si no es mucho pedir) si podrías mandarme el code limpio por email como para agregarselo a mi html, lo estoy necesitando con bastante urgencia…Segui asi, y un excelente año Vecino!

Saludos desde Argentina!

Luciano Montenegro

6
Feb
2009

Se lo mandé a todos por mail. Si alguien más lo quiere, que me avise. Está en un estado genérico: deben editarlo en función del sitio donde vayan a tomar la información.

Saludos

6
Feb
2009
andres

hola martin recibi tu mail pero no he podido configurarlo para que funcione.

6
Feb
2009

Gracias Martin por enviarme el código, aprenderé de el, de momento lo he solucionado de otra manera, puedes verlo en :
http://www.suciudad.com/tiempo.php?&category=2123
sacado directamente de aquí:
http://www.aemet.es/es/eltiempo/prediccion/localidades?l=15060&p=15
gracias por tu atención
Saludos

13
Feb
2009
manuel

Samtarem, me podrias decir como has conseguido meter en tu web la prediccion de aemet.es sin que aparezcan los menus?

Te lo agradeceria mucho.

16
Feb
2009

Andrés, si tenés alguna duda concreta con gusto te doy una mano.

Manuel, no estoy seguro pero a juzgar por el código HTML, pareciera que tiempo.php es un script que toma la información del sitio ese (aemet.es), la procesa y genera la salida. Algo similar a lo que propongo en este script.

Saludos,
martin.-

17
Feb
2009
manuel

Gracias, Martin, aunque creo que el codigo te lo dan en aemet.es, pero si es asi, no encuentro el sitio donde aparece.

5
Mar
2009
jesus

Hola… pues andaba buscando exactamente esto..
me podrias mandar a mi correo los archivos..

ahora… es lo mismo que debo hacer para obtener la informacion pero de The Weather Channel en weather.com ???

jeje..
saludos desde mexico

5
Mar
2009
jesus

la que esta en esa pagina de The Weather Channel ya trae uno, pero quisiera tomar los datos de el para que los modifique (generalmente las imagenes) por que yo hice mis propias imagenes. ademas de presentar el tiempo en idioma español..
gracias..

saludos de nueva cuenta.

6
Mar
2009

Enviado por correo Jesús.

Saludos

6
Mar
2009
AndRu

Hola MARTIN!, me podrias mandar el codigo por mail?, ya lo tenes preparado para WORDPRESS?, o algun php pronto para que yo lo integre?.

Gracias!.

28
Mar
2009
vikingo

Muy buen aporte Martin.
Te agradecería si me mandas el codigo a mi mail.

Mil gracias.

14
May
2009

Hola Martín,

No me quedó muy claro cómo sacar la información de la página original, me podrías enviar tu código armado?

Me gustaría usar los datos que están en ésta página: http://weather.yahoo.com/forecast/UYXX0006_c.html

Gracias y perdón por el atrevimiento!

20
May
2009

Como hago para agraegar el estado del tiempo en mi blog Desde ya Gracias

24
May
2009
Johnny

Hola martin, me podria manda el codigo a mi correo ya q soy estudiante nuevo en php. y quiero colocar el estado del tiempo tambien en mi pagina.. Desde ya mucha gracias

18
Jun
2009

Muy bueno, pero precisaría que adjuntes los archivos .php de ser posible, no entiendo bien cómo habría que ponerlo.

Gracias

7
Aug
2009

Hola martin la verdad me asombró mucho lo que haces..ahora estoy haciendo mi pagina y quisiera me mandaras los codigos por mail..porque a igual que otros soy muy novato en php y si lo necesito para ponerla en mi web. Un abrazo y muchas gracias adelantadas

12
Aug
2009

Enviado por mail..

Saludos!

20
Sep
2009
Familia Montero

Todo muy bien. pero….como no entendemos nada, la idea es la misma del principio:
¡ que código se debe poner en mi web ? para que se vea el tiempo de Maldonado, por Ejemplo…

Gracias y esperamos la respuesta.-

21
May
2010
Pablo

Muchas Gracias! Me fué de mucha utilidad !!
Los chicos de Buquebús cambiaron el código, ahora Bs As aparece segundo, pero no es un problema mayor acomodarlo a eso.
Por otra parte, para los que hagan copy paste con el código que esta publicado, OJO! que en uno de los $buenos_aires_imagen le falta una letra “s”.. esta asi: $bueno_aires_imagen si no lo arreglan por mas que le den no va a funcar…

Gracias y Saludos!!

25
Sep
2010
Pablo

Buena técnica
gracias por el aporte
yo hice lo mismo pero para las cotizaciones de las monedas, aclaro que no soy experto en programación.
El código:

/*
$archivo_dir =”http://www.cambiolafavorita.com.uy/index.php” ;
if($archivo_dir){
$archivo = fopen($archivo_dir, rb);

$texto_archivo = strip_tags(stream_get_contents($archivo));

$puntero = strpos( $texto_archivo ,”DOLAR”);
$datos_a_extraer=”";
for ($i=0 ; $i $value){
if($value == “”) {
unset($viejos_valores[$key]);
}
}
$valores = array_values($viejos_valores);
$dolar_compra = $valores[2];
$dolar_venta = $valores[4];
$euro_compra = $valores[20];
$euro_venta = $valores[22];
$argentino_compra = $valores[39];
$argentino_venta = $valores[41];
$real_compra = $valores[57];
$real_venta = $valores[59];

}elseif ($datos_a_extraer=-1){
$datos_a_extraer=”N/A”;
}
}

fclose($archivo);

$br=”";
echo “Dolar Compra: “.$dolar_compra.$br;
echo “Dolar Venta: “.$dolar_venta.$br;
echo “Euro Compra:”.$euro_compra.$br;
echo “Euro Venta: “.$euro_venta.$br;
echo “Argentino Compra; “.$argentino_compra.$br;
echo “Argentino Venta: “.$argentino_venta.$br;
echo “Real Compra: “.$real_compra.$br;
echo “Real Venta: “.$real_venta.$br;
*/

El problema que tengo que no puedo hacer el unset de los elementos del array que estan vacios

29
Sep
2010

Buenasss necesitaría poner la cotización de la moneda copiada de la página del BROU http://www.brou.com.uy/web/guest/institucional/cotizaciones ..me podes mandar el código HTML que tengo que agregar en un gadget por e-mail..? Muchas gracias!

20
Jul
2011
Flabio

Hola me gustaria saber si alguien logro hacer funcionar esto para tomar la cotizacion de la moneda del brou o de alguna casa cambiaria. Muchas gracias. Saludos.

9
Oct
2011
Jrondon

Quien me da una mano.. sabes que soy nuevo en programacion.. y en verdad me gustaria agregar el cambio de moneda en mi pagina web.. y no se como entrarle.. estoy aca en uruguay.. estoy trabajando en aspx.net. desde ya mucha gracias..

uruvenz78@hotmail.com

15
Oct
2011

Hola martin Felicitaciones por la explicación no se de este lenguaje de programación pero si podrias mandar el codigo por email te lo agradecería para ponerlo en un widget de mi blog. te escribo de Mazatenango Suchitepéque, Guatemala.

17
Oct
2011
lhmanuel

Hola martin, se muy poco de php y necesito coger los datos de “tu tiempo.net” y ponerlos en mi pag con un estilo y tamaño de letra diferente a los que ellos ofrecen en su script.

Me serviria tu metodo? la pag en concreto es http://www.tutiempo.net/TTapiV2/_NHx8MDAwMDAwfHN8bnxzfEUzNTEzMHw4MHwxNnwxfDZ8NXwxMHwyNXxzfHN8bnxFODZGNkZ8NzFCOUYwfHx8RkZGRkZGfDQ1fDgwfDgwfDQyM3wxMDB8OTd8NTN8MjB8MjB8NDV8ODh8Mzh8

Tambien necesito que se refresque cada cierto tiempo?Muchas gracias

17
Oct
2011
lhmanuel

Hola martin, se muy poco de php y necesito coger los datos de “tu tiempo.net” y ponerlos en mi pag con un estilo y tamaño de letra diferente a los que ellos ofrecen en su script. La pag en concreto es http://www.tutiempo.net/TTapiV2/_NHx8MDAwMDAwfHN8bnxzfEUzNTEzMHw4MHwxNnwxfDZ8NXwxMHwyNXxzfHN8bnxFODZGNkZ8NzFCOUYwfHx8RkZGRkZGfDQ1fDgwfDgwfDQyM3wxMDB8OTd8NTN8MjB8MjB8NDV8ODh8Mzh8, Tambien necesito que se refresque cada cierto tiempo? Es posible hacer esto con tu metodo, gracias

25
Mar
2012
Nico

Buenas alguien pudo hacer el widget apra la cotizacion del BROU? estoy a l asputeadas con eso mismo y necesito una mano
wico123@gmail.com

18
Apr
2012
Pepe

Yo estoy terminando ese widget para unos clientes y lo pondré a la venta a un costo muy accesible. Así quien lo necesite no se rompe la cabeza con eso (ya lo tuve que hacer yo)
Quien esté interesado me puede contactar en: skysys.development en gmail.

Escribir un comentario