Diskuze: Potřebuji pomoct s úlohou
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
To zalezi na tom, jakym zpusobem s tim chces dal pracovat. Pokud s tim nebudes delat vubec nic, tak to muze byt klidne jen o js + iframe
<form>
<input type=text name=adresa>
<input type=button onclick="out.src=this.form.adresa.value;">
</form>
<iframe name=out src=""></iframe>Tu adresu muzes poskladat z ruznych inputu.
Pokud s tim budes chtit delat neco dal, tak budes muset stahovat stranku pres php, prikaz file_get_contens
php.net/file_get_contentsJak to tedy funguje, kdyz to vsechno nebezi jen u tebe pro tve poteseni?
- Webovy prohlizec stahuje soubor z internetu. Takze, musis mit nekde v internetu pripojeny pocitac, ktery je pro internet viditelny. Ten ma pridelenou IP adresu, jakesi id, ciselne oznaceni. K id je mozne pridelit i textove oznaceni, name, pro uzivatele, treba seznam.cz. Seznam id + name je ulozeny na pc, ktery ma nastarosti smerovani, bezi na nem sluzba DNS, domain name server. Kdyz uzivatel zada adresu do prohlizece, kontaktuje se DNS a ten rekne tvemu prohlizeci IP adresu pc stranek a odtud se pak stahuje.
- Tento vzdaleny pocitac (muzes mit i na stole, ale vetsinou se jedna o cizi pocitac) se nazyva server. Na nem bezi programy, ktere reaguji na pozadavky, ktere dostane z internetu. Je tam treba program mail, php, sql a jine (asi 10-1000 dalsich, podle velikosti serveru). Pokud chces pouzivat cizi pocitac, vetsinou na nem jsi host, hostujes, takze inetova sluzba, ktera poskytuje prostor pro webove stranky se nazyva hosting. Coz je blby nazev, ale budiz.
- Hosting ma ruzne moznosti. Muze nabizet cele hotove php programy nebo jen diskovy prostor ci jine sluzby. Napriklad, spoustu lidi chce hosting s wordpressem. To je php program pro editaci webovych stranek typu clanky. Takovych typu programu je vic, treba eshop, inzertni portal, clanky, forum (jako itnetwork), chat, mail. Mail program je webove rozhrani, ktere kontaktuje mail-server a vymenuje si s nim data, napriklad google-mail je webovy program, ktery se pripojuje ke g-mail serveru a zobrazuje uzivateli data pro nej v prijatelne podobe, tabulky, tlacitka. Totez dela treba outlook nebo thunderbird, mozna znas.
- S temi programy komunikujes jejich prikazy. Kratky prikaz a poslou ti data. Vypada to treba takto:
"mail prihlas uzivatele=adam, heslo=vecerka"
"mail posli seznam zahlavi poslednich 100 mailu"
"mail odhlasit"
"sql prihlasit"
"sql vyber data z tabulky uzivatele, kde uzivatel.jmeno zacina pismeny 'ad' a
serad ten seznam podle jmena"
"sql odhlasit"
"ftp prihlasit"
"ftp nahrej na hosting soubor"
"ftp odhlasit"
"apache posli soubor html / obrazek / text, zip, cokoliv"
Neni treba se prihlasovat. Ale lze nastavit jednoduche prihlasovani na nektere
sekce.
"php prihlasit"
"php spust muj-program.php a predej mu data (soubor, text, prikaz)"
"php odhlasit"
To jen jako pro predstavu, ze kdyz s necim vzdalene komunikujes, tak si vymenujes jen prikazy a vse ostatni jsou pro ty programy jen data, ktera predavaji nekam dal.
Zpet k tvemu ukolu (pokud nestaci jednoduche reseni). Chtel jsem jen naznacit, ze pak je velke mnozstvi moznosti, jak to resit.
Co mas jiste?
- Bude treba google poslat pozadavek na vyhledavani.
- Bude treba stahnout data z google vyhledavani.
1. Google pozadavek
Aby tomu google rozumnel, musi mit stravny tvar. Nejjednodussi cesta, jak to
zjistit je spustit si google.com a zkusit nejaka slova vyhledavat. Treba Antonin
Sova
google.com
hledat = Antonin Sova (enter)
A pozadavek, ktery google potrebuje je v adresnim radku:
https://www.google.com/search?… // tobe staci
https://www.google.com/search?…
Kdyz takovouto stranku zadas do prohlizece, tak ti zobrazi vysledky vyhledavani.
2. Jak to ulozim?
Pokud to dal nepotrebujes zpracovat, jen zobrazit, tak v html existuje prvek
iframe. Jemu, kdyz das adresu, tak ti na html strance zobrazi stranku.
<iframe src="https://www.google.com/search?q=Antonin+Sova"></iframe>Jenze s vysledkem nelze nic dal delat, protoze prohlizece maji nastavena
omezeni pro praci s obsahem cizi stranky kvuli hackerum a podvodnikum, kteri
treba finguji bankovni stranky, mailove stranky a jine. Takze ti ten prvek pouze
dovoli zobrazit adresu stranky.
Ale, mozna ti to staci. A pak potrebujes jen kod, ktery ti tu adresu posklada a
preda iframu.
Ok, ale na zacatek. Rekneme, ze nevis, o cem je ted rec.
Jak udelam tu www stranku?
- Www stranka je text, kod, ktery je mozne napsat v textovem editoru, treba v Poznamkovy blok.
- Tento kod ma jakasi pravidla, podle kterych umi webovy prohlizec zobrazit prvky na strance, treba tlacitka. jak se co pise je otazka asi hodinove prednasky + odkaz na literaturu. Na webu je treba stranka jakpsatweb.cz/html
- Do kodu muzes napsat: text, kod jazyka html, kod css formatovani,
javascript. Nic dalsiho neumi prohlizec zobrazit. Co jsem napsal uplne na
zacatku je html kod + javascript. Az na to, ze nic z toho nefunguje, jak ted
zkousim
Protoze je u google
nastaveny zakaz zobrazeni obsahu pro cizi stranku. Takze zrovna pro google musis
jit tou tezsi cestou. Kod, ktery jsem zkousel je tento:
<form>
<input type="text" name="adresa" value="https://www.google.com/search?q=Antonin+Sova">
<input type="button" value="vyhledej1" onclick="document.getElementsByName('out')[0].src=this.form.adresa.value;">
<input type="button" value="vyhledej2" onclick="out.location=this.form.adresa.value;">
<input type="button" value="test" onclick="alert(this.form.adresa.value); alert(document.getElementsByName('out')[0]); alert(out);">
</form>
<iframe name="out"></iframe>
<iframe src="https://www.google.com/search?q=Antonin+Sova"></iframe>Neva...
**Jak tedy udelam www kod, treba u sebe? **Navod najdes na jakpsatweb.cz. Strucne takto:
- Kliknes pravym tlacitkem na plochu
- Soubor - Novy - textovy dokument
- 2x na nej kliknes, spusti se Poznamkovy blok
- tam napises kod
<b>Vitejte</b>
Vitejte- pak, menu nahore Soubor - ulozit jako - typ = vsechny souboru, nazev = test.html
- ok
A mas na plose ted soubor test.html.
Tak na nej 2x klikni a mel by se spustit webovy prohlizec a v nem zobrazit 2x
text vitejte, jednou bude tucne podruhe ne.
Ok.
Ted je nutne kod dostat na hosting nebo pc, ktery je dostupny jinym uzivatelum
internetu. Coz tvuj nejspis neni. Nejjednodussi cestou je hosting.
- potrebujes si najit sluzbu, ktera poskytuje hosting. Tech je tisice. Takova hodne znama je u nas forpsi, ale stejne tak 100 dalsich. Jenze mozna bude lepsi cesta jit pres jakpsatweb, viz niz
https://www.forpsi.com/webhosting/
nabizi tam ruzne sluzby (php, sql, wordpress, mail...), ale tebe z toho zajima jen PHP, FTP a misto na disku pro tve souborygoogle = free hosting s domenou
https://www.jakpsatweb.cz/…-zdarma.html
Maji tady seznam free hostingu.
Ty totiz potrebujes 3 veci.
- Mit pocitac, ktery ma verejnou ip adresu. + Mit hosting, pocitac, kde mas ulozena data. (to muze a nemusi byt jeden stroj)
- Mit pridelenou adresu v internetovem DNS, ktera smeruje na ten pocitac s ip adresou. Rika se tomu mit domenu.
A za kazde se plati zvlast nebo dohromady. Nicmene, minimalne domena je
placena.
Predpokladam, ze na jakpsatweb.cz maji vybrane uz takove hostingy, kde oboje je
zdarma, ale je tam pak kompromis, ze pouzivas cizi domenu. Priklad:
- registrujes se u webzdarma. Ti nabizi domeny wz.cz, websdarma.cz, a dalsich 5 tusim, jako mystiq.cz a pod
- registrujes si adresu "tomas.zeleny", domenu "wz.cz"
- vyberes si pouze diskovy prostor + ftp + php (a ostatni vetes, jako mail, kterou asi nevyuzijes, https)
- tva webova stranka pak bude: https://tomas.zeleny.wz.cz/
Momentalne tam nic neni.
Jak nahraji na domenu moji stranku?- K tomu se pouziva FTP program. Pokud zadny nemas, nejaky si najdi. Nebo v pripade wz.cz vyuzij jejich webovy ftp
- wz: wz.cz, prihlasis se hostingovym jmenem a heslem. A nekde vpravo v menu bude nahrat soubory nebo FTP nebo tak neco. To si najdes v navodech, jak se s tim pracuje. Ale ve smes jako na jinem webu, kdyz nahravas obrazek nebo prilohu do mailu na seznam,cz Proste tam budes muset z disku nasoukat soubor po souboru.
- Kdyz zadas
https://tomas.zeleny.wz.cz/, tak prvni stranka se zobrazuje index.html. Takze nas test.htm, co mas na plose je treba nahrat na wz.cz-ftp a jeste jen prejnovat na index.html. A nebo ne, ale pak se spousti jako
https://tomas.zeleny.wz.cz/test.htmOk. Rekneme, ze jsi uspesne nahral soubor test.htm na hosting a ze kdyz zadas v prohlizeci adresu
https://tomas.zeleny.wz.cz/test.htmTak se zobrazi totez, co na disku, 2x vitejte, jednou tucne.
Super. Tak takhle to funguje
Jak pracovat s google vysledky?
K tomu potrebujes php. Php je program, ktery bezi na serveru. Umi, podle
programovych instrukci php, vygenerovat soubor. html, text, obrazek, zip,
cokoliv. Nas ted zajima jedine. Potrebujeme stahnout vysledky googlu do souboru
a poslat je webovemu prohlizeci jako text, treba. To se dela prikazy echo a
file_get_contents.
- Vytvoris si u sebe na disku textovy soubor (podobne jako u toho html). tam napises
<?php
$url = "https://www.google.com/search?q=Antonin+Sova";
$data = file_get_contents($url);
echo $data;
?>- soubor nahrajes na hosting, podobne jako test.html. Pojmenuje jej stahuj.php.
- pak je mozne jej "zavolat" jako
https://tomas.zeleny.wz.cz/stahuj.phpK cemu je to dobre? Php ti stahne soubor jako text. Neresi cross-origin
omezeni. Ale, zas tim ztratis nejake vyhody originalni stranky, ktere pro tebe
vsak nejsou podstatne, tebe zajima jen html kod, ktery takhle ziskas.
Takze, v tuto chvili je mozne test.html kod upravit tak, ze misto
<iframe src="https://www.google.com/search?q=Antonin+Sova"></iframe> tam das
<iframe src="https://tomas.zeleny.wz.cz/stahuj.php"></iframe>Super, ale
Jak tam zadam jine slova nez Antonin+Sova?Tady se to komplikuje. Zkusim to udelat vsechno naraz, ale pisi to z hlavy,
za chyby nefucim . Je treba
upravit formular, tag form. A je treba jej propojit s php kodem. Soubor
pojmenujes jako test2.php.
<?php
$slova = isset($_GET['slova']) ? $_GET['slova'] : ''; // vyber z get promenou slova, jestli existuje
$slova = trim($slova); // odstran mezery pred a za textem
$url = "https://www.google.com/search?q=";
$url = $url . urlencode($slova); // zakoduj slova do formatu pro url a pridej k adrese
$data = file_get_contents($url);
// #data = htmlspecialchars($data); // dve lomitka jsou komentar, odstran na zacatku a $data ti bude zobrazovat jako html kod
?>
<form action="test2.php" method="get">
<input type="text" name="slova" value="Antonin Sova"> -- zmena name="..."
<input type="submit" value="vyhledej"> -- zmena type="...", odstraneno onclick (javascriptova cast, misto ni pouziji php)
</form>
Nalezene vysledky;
<div>
<?php echo $data; ?>
</div>- upravil jsem do formulare policko pro zadavani slov (pred tim se tam davala cela url)
- odstranil vsechny testovaci veci
- nastavil formular na metodu posilani dat get (dalsi mozna je post)
- nastavil formulari adresu k odesilani. Kdyz se klikne na tlacitko submit, tak prohlizec vybere data z prohlizece a posle pozadavek na adresu zadavou ve form action. Na serveru se vytvori prikaz
"php spust program test2.php a posli do nej data $_GET['slova'] = zadanaslova"
- toto si musis v php prevzit, z pole $_GET s promene 'slova'. text 'slova' odpovida html kodu: input name="slova"
- pritom je treba si overit, zda ta promena v poli existuje, byla poslana, to dela php prikaz isset()
- tento text je vsak nutne zasifrovat pro url, protoze ma jen urcite povolene znaky, to dela prikaz php urlencode().
- a pak je treba stahnout stranku z googlu tim file_get_contents
- a tuto stranku dal muzes zpracovat, napriklad ji formatovat pro html pomoci prikazu htmlspecialchars a vypsat do stranky, prikaz echo
... na disku ti php soubor nebude fungovat, prohlizec php kod neumi. Musis nahrat na server. Server z nej pomoci php vyrobi html soubor pro prohlizec.
Cili, i s registraci a php / html kodem se jedna asi o 5-15 minut. Sepsani
tohoto mi zabralo 3h. Mohl sis najit navody googlem, pripadne na jakpsatweb.cz
Tak, je hezke, ze mi pises zpravy, ale muzes to psat sem. Co mas tedy hotove?
Jako kod? Takhle ti muzu rici, ze tam mas neco spatne nebo ma google nejake
opatreni proti stahovani jeho stranek. Nikdy jsem nic podobneho nepotreboval,
takze nevim.
Jinak, google nejspis ma i kod, ktery se da vlozit do stranky, ktery vsechno
tohle resi. Jen bys musel zjistit, kde to tam ma
Zobrazeno 6 zpráv z 6.