Programujeme YQL: Vyrobil jsem si galerii z Google Drive

Yahoo má svůj YQL – Yahoo Query Language. Programátorům řekne, jaké je počasí v Brně, jak je dlouhý Karlův most, ale analyzuje i složitější HTML kód. Využití je široké.

Už je tomu pěkná řádka let, co jsme na Živě.cz psali o službě Yahoo Pipes. Ve stručnosti tedy připomenu, že se jednalo o speciální webový editor, kde jste si s pomocí diagramové struktury propojili různé webové zdroje a vytvořili RSS zdroj, který jste pak mohli odebírat třeba ve čtečce. Kouzlo Yahoo Pipes spočívalo v tom, že jste v něm dokázali snadno vytvořit jeden RSS, který se skládal z vícero zdrojů, mohli jste použít nejrůznější filtrování a třeba i překlad do angličtiny, pokud jste odebírali zdroj třeba z nějakého německého specializovaného zdroje.

YQL všechno ví

Abyste ovládali Yahoo Pipes, nemuseli jste napsat ani řádek kódu, stačilo se prostě jen zorientovat v prostředí. Yahoo toho ale nabízí mnohem více, dnes se tedy ve stručnosti podívám na YQL – Yahoo Query Language, i ten vám totiž může ušetřit hromadu práce, i když tentokrát se už jedná o nástroj pro ty, kteří budou s pomocí YQL a dalších prostředků rychleji skriptovat.

Pakliže budu naprosto stručný, YQL je vlastně jednoduchý a univerzální znalostní a parsovací dotazovací jazyk, který připomíná databázový SQL. Pomocí YQL tedy můžete Yahoo položit třeba dotaz: „Jaká je předpověď počasí pro Brno“ a server vrátí odpověď buď v XML, nebo JSON, což potěší zejména kodéry v Javascriptu, zpracování takových dat je totiž pak extrémně jednoduché.

Takto v YQL vypadá dotaz na počasí v Brně:

select * from weather.forecast where woeid=786869

794892249
Konzole YQL a obsáhlá odpověď ve formátu XML, která obsahuje aktuální stav počasí v Brně a předpověď na několik následujících dnů

Chytří si už všimli, že v dotazu chybí jakákoliv zmínka o Brnu, to ale představuje místopisný identifikátor WOEID. Jedinečný identifikátor Brna bych pak mohl získat dalším dotazem:

select woeid from geo.placefinder where text="brno"

V dotazech tedy používám různé znalostní knihovny. V prvním případě to byl modul WEATHER, v tom druhém pak GEO. V tomto konkrétním případě chci od Yahoo získat pouze identifikátor WOEID pro Brno, ale stejně tak bych mohl zadat jiné hodnoty, třeba zeměpisnou polohu, případně úplně všechno tradičním parametrem * jako v předchozím příkladu.

GEO.PLACEFINDER se přitom neomezuje pouze na obce, ale v podstatě jej mohu vyzkoušet na libovolné místo zájmu (POI), o kterém má Yahoo nějaké tušení. YQL tedy najde i Karlův most:

select longitude,latitude,radius from geo.placefinder where text="karlův most"

YQL mi v tomto případě vrátí longitude (zeměpisná délka), latitude (zeměpisná šířka) a radius (velikost/poloměr objektu). Stejně tak bych mohl hledat ulici, číslo popisné a další informace.

819434385 932837897
Konzole YQL: Nalezení Karlova mostu a výsledek v JSON a XML

Volám tě YQL

No dobrá, ale jak takový YQL mohou použít v praxi třeba v Javascriptu? Jak vlastně YQL zavolám? Pro konstrukci a testování samotného dotazu tu je webová YQL Console, ve které si můžete zvesela hrát a zkoušet, co YQL všechno umí a kde to naopak skřípe, v praxi pak ale stačí zkonstruovat běžný HTTP GET dotaz v libovolném jazyku.

764667154
Nepotřebujete žádný klíč API a účet. Dotaz je anonymní a funguje odkudkoliv

Adresa YQL dotazu pro zjištění polohy Karlova mostu s odpovědí ve formátu JSON tedy bude vypadat takto:

https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20geo.placefinder
%20where%20text%3D%22karl%C5%AFv%20most%22&format=json

Adresa se tedy skládá ze společného základu https://query.yahooapis.com/v1/public/yql?q=, pak následuje samotný YQL dotaz zakódovaný do formátu URL (v Javascriptu třeba s pomocí funkce encodeURIComponent) a konečně následuje formát odpovědi, tedy format=json. Pokud parametr format nepoužijete, odpověď se zobrazí v XML.

Vše funguje bez jakéhokoliv API klíče a autentizace, takže dotaz na server query.yahooapis.com můžete volat naprosto odkudkoliv.

YQL v praxi: Fotogalerie vytvořená nad Google Drive

Tak a teď si pojďme vyzkoušet YQL v praxi společně s Javascriptem a HTML. Pokud používáte webový disk Google Drive, tak možná víte, že adresář, který sdílíte naprosto veřejně, má také zcela veřejný odkaz pro hostování ve formátu https://googledrive.com/host/identifikátor adresáře/.

147449712 677954722
Správa veřejně sdíleného adresáře a jeho podoba po návštěvě adresy pro hostování.

Pakliže adresář obsahuje nějaké soubory, na takové adrese objevíte jejich strom a můžete k nim přistupovat naprosto stejným způsobem, jako by se jednalo o běžný adresář na webovém serveru. Když tedy bude ve veřejně sdílené složce soubor strom.jpg, jeho přímá adresa bude vypadat https://googledrive.com/host/identifikátor adresáře/strom.jpg.

144119968 705742041
Zobrazení seznamu souborů adresáře a přímý odkaz na veřejně hostovaný soubor

Google Drive lze tedy použít pro jednoduchý webhosting. Stačí vytvořit veřejně sdílenou složku, nahrát do ní nějaké HTML soubory, a pokud vám nebude vadit trošku horší adresa s dlouhým identifikátorem složky, získáte prezentační prostor zcela zdarma a na silných serverech Googlu.

Tak a teď konečně k mému příkladu. Na Google Drive jsem si vytvořil veřejný adresář Galerie, do kterého jsem vložil další dva adresáře s fotkami, Budou se chovat jako dvě alba. Komukoliv pak pošlu adresu složky Galerie, může ji procházet a zobrazovat obrázky.

Já bych ale chtěl použít trošku jiný frontend – tedy jinou webovou podobu, aby to celé nevypadalo jako adresář, ale běžná webová galerie. Google nabízí robustní Drive API, k jeho použití je ale povinná autentizace a bylo by to kódování na celý večer.

Namísto toho tedy použiji YQL. Tentokrát však nebudu hledat Karlův most a počasí v Brně, ale vyzkouším modul HTML, který slouží ke zpracování libovolného dostupného HTML kódu. Stejně tak si YQL poradí s RSS, CSV a dalšími formáty.

Takže jdeme na to. V následujícím dotazu dávám YQL příkaz, aby navštívil můj veřejně sdílený adresář na Google Drive a ve formátu JSON mi vrátil seznam všech jeho složek a souborů:

select * from html where url="https://googledrive.com/host/0B11plVWcN3hAeFRERDhVcnB2Mzg/" and xpath='//div[@class="folder-cell"]/a'

První část dotazu asi nepotřebuje bližší komentář – Yahoo si prostě stáhne webovou stránku z adresy googledrive.com. Veškerá magie je schovaná ve filtru xpath. Pomocí něho jsem YQL přikázal, aby z HTML kódu vrátil pouze obsah elementů DIV, které používají třídu CSS jménem folder-cell. No a tento styl mají právě jen vnořené adresáře a soubory – v tomto případě tedy fotky.

Uvnitř každého z těchto divů je už pouze element A, tedy odkaz. Výsledkem dotazu tedy bude odpověď XML/JSON s polem záznamů, z nichž každý obsahuje položky href (samotný odkaz) a content (text odkazu).

731541345
Konzole YQL: Z webové stránky Drive jsem vyfiltroval jen názvy a odkazy složek. V tomto případě se jednalo o adresáře Tapety a Z mobilu, které nyní mohu zobrazit trošku jinak než standardní Drive.

Pomocí YQL jsem si tedy vytvořil jednoduchý HTML parser – jistě ale najdete spoustu lepších příkladů použití než právě tuto galerii.

Pak už stačí pouze vytvořit jednoduchou stránku, kde například s pomocí jQuery pošlete YQL dotaz na server Yahoo, získáte odpověď se seznamem adresářů v kořenovém adresáři Galerie, složky libovolným způsobem vypíšete a stejně pak budete postupovat po klepnutí na jednotlivou složku/album, ačkoliv tentokrát už budete rovnou zobrazovat obrázky uvnitř.

920951749
Nový pohled na veřejně sdílenou složku Galerie. Ještě by to chtělo zásah webdesignéra.

Veškerou špinavou práci za vás udělal Yahoo a vy tedy můžete veřejně sdílenou složku z Google Drive zobrazit naprosto odlišným způsobem. Hotový HTML soubor s galerií pak můžete opět umístit na Google Drive.

329055608
A konečně pohled na obsah složky s fotkami zobrazené jako album miniatur. Pokud bych tuto stránku nehostoval na Google Drive, nikdo ani nepozná, že se fotografie načítají právě z tohoto úložiště.

Tento příklad ale berte pouze jako elementární technickou ukázku. Pakliže byste tímto způsobem opravdu chtěli vytvořit vlastní galerii hostovanou pomocí Google Drive, vyplatí se vytvořit si také miniatury. S těmi v tomto případě nepracuji a v šachovnici fotek tedy zobrazuji rovnou zmenšené originály, což pochopitelně není ideální řešení a zbytečně zatěžuji jak Google, tak vlastní linku.

Yahoo YQL je poměrně mocný nástroj a šlo by jej vlastně kombinovat i s Yahoo Pipes. Má pouze jednu principiální slabinu. Jelikož veškeré dotazy zpracovává třetí strana, chvíli to trvá. Posuďte sami: Místo toho abych navštívil přímo strom složek na Google Drive, jej nejprve stáhne a rozřeže Yahoo a následně opět zkonstruuje třeba právě Javascript v prohlížeči. Hlavní daní za tyto hrátky je tedy čas, což je na internetu poměrně drahá komodita.

Diskuze (3) Další článek: Facebook zveřejnil letošní příjmy, miliarda uživatelů je mobilních

Témata článku: , , , , , , , , , , , , , , , , , , , , , , , ,