C

M

Y

K

Formularz HTML

Formularz HTML definiujemy stosuj¹c element FORM. Wewn¹trz po-
miêdzy znacznikami <FORM> oraz </FORM> umieszczamy zawartoœæ
formularza, na któr¹ sk³adaj¹ siê kontrolki (np. INPUT) oraz elementy for-
matuj¹ce (np. TABLE). Typowy formularz sk³ada siê z elementu FORM
zawieraj¹cego tabelê, wewn¹trz której umieszczono kilka kontrolek.

LISTING 1:

P

RZYK£ADOWY FORMULARZ

<FORM action=”jakis-skrypt.php”>
<TABLE>
<TR>

<TD>Imiê:</TD>
<TD><INPUT name=”imie”></TD>

</TR>
<TR>

<TD>Nazwisko:</TD>
<TD><INPUT name=”nazwisko”></TD>

</TR>
<TR>

<TD>&nbsp;</TD>
<TD><INPUT type=”submit” value=”Wyœlij”></TD>

</TR>
</TABLE>
</FORM>

Listing 1 tworzy formularz, który zawiera dwa pola do wprowadza-

nia danych (pola te nazwano Imiê i Nazwisko) oraz przycisk Wyœlij.
Osoba odwiedzaj¹ca witrynê mo¿e umieœciæ kursor wewn¹trz pól for-
mularza, wype³niæ je, po czym przes³aæ formularz naciskaj¹c przycisk
Wyœlij. Treœæ wprowadzona przez u¿ytkownika zostanie przes³ana do
skryptu o nazwie jakis-skrypt.php. Nazwê skryptu przetwarzaj¹cego
formularz podajemy jako wartoϾ atrybutu action elementu FORM.

Rys. 1. Formularz z listingu 1 przed i po wprowadzeniu danych

Po naciœniêciu przycisku Wyœlij wizyta zostanie przeniesiona pod

adres jakis-skrypt.php. W skrypcie tym bêd¹ dostêpne dane wprowa-
dzone przez u¿ytkownika w formularzu.

Skrypt przetwarzaj¹cy formularz zawarty w pliku jakis-skrypt.php

mo¿e byæ napisany w dowolnym jêzyku programowania dynamicz-
nych stron WWW. Mo¿e to byæ PHP, Perl, ASP, JavaServerPages,
skrypty CGI w bashu, C czy nawet Pascalu. Jednak nie ma mo¿liwoœci
przetworzenia formularza w jêzyku HTML. Do przetwarzania for-
mularza musimy u¿yæ jednego z jêzyków skryptowych, które s³u¿¹
do programowania dynamicznych stron WWW.

Zatem korzystanie z formularzy wymaga znajomoœci zarówno jêzyka

HTML, jak i jêzyka skryptowego. Jêzyk HTML zajmuje siê jedynie wy-
gl¹dem zewnêtrznym formularza. Stosuj¹c elementy HTML uk³adamy za-
wartoœæ formularza na stronie oraz ustalamy adres URL skryptu, który bê-
dzie zajmowa³ siê przetworzeniem danych pochodz¹cych z formularza.

Jeœli formularz z listingu 1 zapiszemy do pliku formularz.html, wów-

czas ca³y przyk³ad bêdzie siê sk³ada³ z dwóch plików. Pierwszym plikiem
jest plik formularz.html zawieraj¹cy kod HTML formularza, zaœ drugim
plikiem bêdzie jakis-skrypt.php. Pamiêtajmy, ¿e nazwa pliku zawieraj¹ce-
go skrypt musi byæ dok³adnie taka, jak wartoœæ atrybutu action formularza.

Kodowanie application/x−www−form−urlencoded

Formularz jest przedstawiany w oknie przegl¹darki w postaci szeregu
kontrolek. Uk³ad graficzny kontrolek nie wp³ywa na sposób zakodo-
wania danych. Dane wprowadzone do formularza s¹ kodowane przez
przegl¹darkê. O sposobie kodowania decyduje atrybut enctype elemen-
tu FORM. Domyœlnym kodowaniem formularzy jest application/x-
-www-form-urlencoded. Kodowanie to polega na utworzeniu par:

nazwakontrolki=wartosc

i po³¹czeniu ich separatorem &. Wszystkie znaki specjalne wystêpuj¹ce
w nazwach lub wartoœciach kontrolek zostaj¹ przedstawione w postaci
kodu szesnastkowego poprzedzonego znakiem procentu. Na przyk³ad
spacja jest zamieniana na napis %20 (kod ASCII znaku spacja – w syste-
mie dziesiêtnym – jest równy 32; liczba 32 w systemie szesnastkowym
wynosi 20).

Nazwy zmiennych s¹ pobierane z kodu HTML formularza. Ka¿da

kontrolka posiada atrybut name. Atrybut ten ustala nazwê zmiennej.
W formularzu z listingu 1 wystêpuj¹ dwie kontrolki o nazwach imie

Formularze tworzymy w języku HTML, stosując m.in. elementy FORM oraz
INPUT. Natomiast przetwarzanie formularza wykonuje skrypt napisany np.
w języku PHP, ASP lub Perl i umieszczony na serwerze.

HTML/PHP

INTERNET.kwiecieñ.2005

102

NA CD

NEWSY

Z OK£ADKI

FIRMA

MAGAZYN

PROGRAMY

WARSZTAT



Uwaga: wszystkie listingi z tego artykułu,

jak również przykłady i program ieHTTPHeaders są

na płycie CD dołączonej do numeru, w katalogu

Warsztat_formularze.

Formularze HTML stanowi¹ mechanizm komunikacji u¿ytkownika odwiedzaj¹cego stronê

WWW z aplikacj¹ internetow¹. Za poœrednictwem kontrolek formularza u¿ytkownik

przekazuje dane do skryptu dzia³aj¹cego na serwerze. W artykule omówimy, co siê dzieje,

gdy internauta wype³nia formularz, jak s¹ zakodowane i jak¹ drogê odbywaj¹ wprowadzone

informacje, oraz metody dostêpu do danych pochodz¹cych z formularza w jêzyku PHP.

W³odzimierz Gajda

JAK DZIAŁAJĄ

FORMULARZE?

FORMULARZE?

JAK DZIAŁAJĄ

C

M

Y

K

oraz nazwisko. Po wprowadzeniu do formularza danych Aleksander
Macedoñski otrzymamy zakodowany napis:

imie=Aleksander&nazwisko=Macedo%F1ski

Litera „ñ” zosta³a zamieniona na kod szesnastkowy %F1. Pierwszy

krok interakcji u¿ytkownika z aplikacj¹ internetow¹ polega na wpro-
wadzeniu danych do formularza. Nastêpnie, po naciœniêciu przycisku
Wyœlij, przegl¹darka koduje wprowadzone przez u¿ytkownika dane, po
czym wysy³a odpowiednie zapytanie.

Przesyłanie danych pochodzących
z formularza protokołem HTTP

Wszystkie transakcje WWW – a zatem tak¿e wysy³anie zawartoœci
formularza – s¹ realizowane przy u¿yciu protoko³u HTTP. Protokó³
ten definiuje cztery metody przekazywania danych. Metodami tymi s¹
POST, GET HEAD oraz PUT. W stosunku do formularzy zastosowa-
nie znajduj¹ dwie spoœród nich: GET oraz POST.

W metodzie GET dane s¹ do³¹czone do adresu URL i przyjmuj¹ postaæ:

http://gdzies.w.sieci/kat/strona.php?imie=Jan&

©

nazwisko=Nowak&plec=M&wiek=35

Natomiast w metodzie POST dane z formularza s¹ do³¹czone na

koñcu zapytania HTTP (za wszystkimi nag³ówkami).

Metodê przekazywania danych formularza ustalamy atrybutem

method elementu FORM. Poniewa¿ wartoœci¹ domyœln¹ jest GET, za-
tem formularz:

<FORM action=”jakis-skrypt.php”>
...
</FORM>

jest równowa¿ny formularzowi:

<FORM action=”jakis-skrypt.php” method=”GET”>
...
</FORM>

Formularz przekazywany metod¹ POST wygl¹da nastêpuj¹co:

<FORM action=”jakis-skrypt.php” method=”POST”>
...
</FORM>

W zale¿noœci od u¿ytej metody, dane pochodz¹ce z formularza od-

bieramy na ró¿ne sposoby wewn¹trz skryptu przetwarzaj¹cego formu-
larz. Wp³yw metody na sposób przekazywania danych formularza mo-
¿emy przeanalizowaæ stosuj¹c wtyczkê programu Internet Explorer
o nazwie ieHTTPHeaders. Oprogramowanie to znajdziemy pod adresem
http://www.blunck.info/iehttpheaders.html

(i na p³ycie CD do³¹czonej do numeru).

Rys. 2. Okno Internet
Explorera po uwidocznieniu
wtyczki ieHTTPHeaders

Po zainstalowaniu wtyczki
nale¿y z menu g³ównego In-
ternet Explorera wybraæ opcjê
Widok | Pasek Exploratora |
ieHTTPHeaders v 1.6. Wów-
czas w oknie przedstawionym
na rysunku 2 ujrzymy szcze-
gó³y dotycz¹ce ka¿dego wy-
sy³anego zapytania HTTP.

Odbieranie danych pochodzących z formularza
w skrypcie PHP

Zapytanie HTTP zawieraj¹ce informacje wprowadzone w formularzu
pokona³o ca³¹ drogê i dotar³o do serwera. Jest ono przekazane przez
oprogramowanie stosu protoko³ów TCP/IP do procesu serwera Apa-
che. Serwer Apache na podstawie rozszerzenia skryptu uruchomi ma-
szynê PHP (lub interpretator Perla czy ASP – zale¿y to od konfiguracji
serwera oraz rozszerzenia skryptu podanego jako atrybut action formu-

larza) i przeka¿e jej zapytanie HTTP. Maszyna PHP przetworzy otrzy-
mane zapytanie, uruchomi skrypt i przeœle do skryptu dane otrzymane
od serwera Apache w postaci wygodnych tablic asocjacyjnych.

Dalsze rozwa¿ania dotycz¹ wy³¹cznie jêzyka PHP.
Tablice $_GET, $_POST oraz $_REQUEST zawieraj¹ce przetwo-

rzone dane pochodz¹ce z formularza i dostêpne wewn¹trz skryptu PHP
s¹ zmiennymi superglobalnymi. Oznacza to, ¿e s¹ one widoczne we-
wn¹trz wszystkich funkcji i metod bez koniecznoœci stosowania s³owa
kluczowego global. Tablica $_GET zawiera dane przekazane do skryptu
metod¹ GET. Tablica $_POST zawiera dane przekazane do skryptu me-
tod¹ POST. Natomiast tablica $_REQUEST zawiera dane pochodz¹ce
z ciasteczek, sesji oraz przekazane metodami POST lub GET.

Wszystkie trzy wymienione tablice s¹ tablicami asocjacyjnymi.

Indeksem w powy¿szych tablicach mo¿e byæ napis. Jakiego indek-
su powinniœmy u¿yæ w celu odczytania imienia i nazwiska pocho-
dz¹cych z formularza widocznego na listingu 1? Napis wprowadzo-
ny w polu zatytu³owanym Imiê jest dostêpny pod indeksem imie,
zaœ nazwisko – pod indeksem nazwisko. Indeksy te s¹ wartoœciami
atrybutu name kontrolek INPUT. Jeœli u¿yto metody $_GET, wów-
czas imiê i nazwisko podane przez internautê w formularzu s¹ do-
stêpne jako:

$_GET[’imie’]
$_GET[’nazwisko’]

Jeœli u¿yto metody $_POST, to nale¿y u¿yæ:

$_POST[’imie’]
$_POST[’nazwisko’]

Zatem wybór metody przekazywania danych z formularza do

skryptu PHP wp³ywa na wybór tablicy superglobalnej, z której skrypt
bêdzie pobiera³ dane. Jeœli stosujemy metodê POST, to nale¿y korzy-
staæ z tablicy $_POST. Korzystaj¹c z metody GET dane pobieramy
z tablicy $_GET.

W starszych wersjach PHP rolê tablic $_GET oraz $_POST

odgrywa³y tablice $HTTP_GET_VARS i $HTTP_POST_VARS
(nie by³y to zmienne superglobalne; ich u¿ycie wymaga³o stosowa-
nia s³owa global, przez co by³y nieco mniej wygodne). Istnieje
tak¿e mo¿liwoœæ przekazywania danych z formularzy w postaci
zmiennych globalnych. O dostêpnoœci zmiennych globalnych
decyduje dyrektywa konfiguracyjna register_globals. Zmienne
globalne s¹ powszechnie uznawane za niebezpieczne i odradza siê
ich stosowanie. Wspó³czesne wersje PHP posiadaj¹ w pliku konfi-
guracyjnym wpis:

register_globals = Off

wy³¹czaj¹cy dostêpnoœæ zmiennych globalnych. Ze wzglêdów bezpie-
czeñstwa zmiennych globalnych nie nale¿y stosowaæ!

Dodajmy jeszcze, ¿e w zwi¹zku z pojawieniem siê ataków typu

XSS (ang. Cross-Site Scripting) równie¿ metoda GET jest uznawana
za niebezpieczn¹.

Indeksami w tablicach $_POST i $_GET są nazwy kontrolek formularza.
Jeśli formularz zawiera kontrolkę:
<INPUT name=”owoc”>
wówczas tablice $_POST I $_GET posiadają element o indeksie owoc.
Po wprowadzeniu przez użytkownika w polu INPUT napisu gruszka,
otrzymamy:

$_GET[’owoc’] = = ’gruszka’

lub

$_POST[’owoc’] = = ’gruszka’

(w zależności od użytej metody).

Dane pochodzące z formularzy przekazywanych metodą GET są dostępne
w skrypcie PHP w tablicy $_GET. Jeśli formularz jest przekazany metodą
POST, to należy użyć tablicy $_POST.

HTML/PHP

INTERNET.kwiecieñ.2005

103

WARSZTAT

PROGRAMY

MAGAZYN

FIRMA

Z OK£ADKI

NEWSY

NA CD



C

M

Y

K

Przetwarzanie danych przez maszynę PHP

Maszyna PHP po odebraniu od serwera Apache zapytania HTTP wy-
konuje pewne przekszta³cenia. Dostêpnoœci¹ danych w skrypcie oraz
wykonanymi przekszta³ceniami steruj¹ dyrektywy konfiguracyjne za-
pisane w pliku php.ini. W kontekœcie formularzy nale¿y zwróciæ uwa-
gê na nastêpuj¹ce wpisy pliku konfiguracyjnego:

register_globals = Off
magic_quotes_gpc = On
variables_order = ”GPCS”
post_max_size = 8M

Dyrektywa register_globals wy³¹cza dostêpnoœæ zmiennych

globalnych. Podkreœlmy jeszcze raz, ¿e ze wzglêdów bezpieczeñstwa
nie nale¿y jej w³¹czaæ (tj. powinna ona mieæ wartoœæ Off). Dyrektywa
magic_quotes_gpc powoduje automatyczne wykonanie operacji
addslashes() na danych odebranych metodami GET, POST oraz po-
chodz¹cych z ciasteczek. Kolejnoœci¹ tworzenia tablic $_GET,
$_POST, $_COOKIE, $_SERVER steruje dyrektywa variables_order.
Jej wartoœæ GPCS mówi, ¿e najpierw jest tworzona tablica $_GET, na-
stêpnie $_POST itd. Wreszcie wpis post_max_size ogranicza rozmiar
danych, które mog¹ byæ przekazane metod¹ POST.

Mo¿emy równie¿ zmieniæ listê znaków traktowanych jako separa-

tory zmiennych w odebranym zapytaniu. Domyœlnie separatorem jest
znak &. Ustalaj¹c:

arg_separator.input

= ”;&”

dodajemy do listy separatorów znak ;. Jest to raczej ciekawostka nie
znajduj¹ca praktycznych zastosowañ.

Dodajmy, ¿e serwer Apache, przed przekazaniem zapytania do ma-

szyny PHP, równie¿ mo¿e wykonaæ pewne transformacje danych. Mo-
g¹ one m.in. polegaæ na przekszta³ceniu adresów URL przez modu³
mod_rewrite. Wiêcej szczegó³ów na ten temat znajdziemy w artykule
Paw³a Grzesiaka pt. „Przyjazne adresy URL” (MI 10/2004).

Jakie dane zostały przesłane do skryptu?

Wszystkie informacje na temat danych pochodz¹cych z formularza i do-
stêpnych wewn¹trz skryptu zwraca funkcja phpinfo(). Jeœli w skrypcie ja-
kis-skrypt.php przetwarzaj¹cym formularz z listingu 1 umieœcimy kod:

<?php
phpinfo();
?>

wówczas funkcja phpinfo() wyœwietli listê wszystkich zmiennych
przekazanych z formularza do skryptu. Na rys. 3 przedstawiono frag-
ment wyniku funkcji phpinfo() zawieraj¹cy elementy tablic $_GET
oraz $_REQUEST.

Rys. 3. Informacje wyœwietlane przez funkcjê phpinfo()

Do przekazywania i przetwarzania danych pochodzących z formularza na−
leży stosować wyłącznie metodę POST oraz tablicę $_POST. Zarówno
zmienne globalne, jak i metoda GET stwarzają pewne ułatwienia, które
– w połączeniu z niefrasobliwością programisty piszącego skrypt – mogą
być wykorzystane przez niepowołane osoby do uzyskania nieautoryzowa−
nego dostępu lub zakłócenia pracy serwisu.

Pierwszy z przyk³adów sk³ada siê z dwóch plików: formularz.html

oraz jakis-skrypt.php. Plik formularz.html zawiera formularz z listingu
1, zaœ skrypt jakis-skrypt.php zawiera wywo³anie funkcji phpinfo().

Drugim sposobem sprawdzenia danych przekazanych do skryptu jest

u¿ycie jednej z funkcji var_dump(), var_export() oraz print_r(). Kod:

<?php
var_dump($_GET);
?>

spowoduje wyœwietlenie w oknie przegl¹darki nastêpuj¹cych informacji:

array(2) {

[”imie”]=>
string(10) ”Aleksander”
[”nazwisko”]=>
string(10) ”Macedoñski”

}

Mo¿emy równie¿, stosuj¹c funkcjê array_keys(), odczytaæ wszyst-

kie indeksy tablicy $_GET, po czym w pêtli foreach wydrukowaæ ko-
lejno wszystkie elementy tablicy:

$keys = array_keys($_GET);
foreach ($keys as $key) {

echo ”\$_GET[’$key’] == {$_GET[$key]}<BR>”;

}

Drugi przyk³ad, podobnie jak i pierwszy sk³ada siê z dwóch plików.

Plik formularz.html jest identyczny jak w pierwszym przyk³adzie.
Natomiast skrypt jakis-skrypt.php z przyk³adu drugiego wywo³uje
funkcjê var_dump() oraz przetwarza w tablicê $_GET pêtl¹ foreach.

W analogiczny sposób mo¿emy oczywiœcie u¿yæ powy¿szych roz-

wi¹zañ do wyœwietlenia zawartoœci tablicy $_POST:

<?php
var_dump($_POST);
?>

Dodajmy jeszcze, ¿e oprócz tablic $_GET, $_POST, $_REQUEST

w skrypcie jest dostêpna równie¿ tablica $_SERVER, która zawiera
szczegó³owe informacje na temat zapytania HTTP. Zmienne:

$_SERVER[”REQUEST_METHOD”]
$_SERVER[”REQUEST_URI”]

zawieraj¹ informacje na temat metody zapytania HTTP oraz ¿¹danego
dokumentu.

Nagłówki transakcji HTTP

Droga danych wprowadzanych do formularza:

X

u¿ytkownik wype³nia formularz, po czym naciska przycisk Wyœlij,

X

przegl¹darka koduje informacje zawarte w formularzu, a nastêp-
nie wysy³a zapytanie HTTP do serwera,

X

oprogramowanie dzia³aj¹ce na serwerze odbiera zapytanie HTTP,

X

zapytanie jest przekazywane przez kolejne warstwy oprogramo-
wania: stos protoko³ów TCP/IP przekazuje zapytanie do procesu
Apache, Apache uruchamia maszynê PHP i przekazuje jej zapy-
tanie, zaœ maszyna PHP przetwarza zapytanie, uruchamia skrypt
i przekazuje do skryptu tablice $_GET, $_POST itd.

X

skrypt przetwarza dane, produkuje wynikowy kod HTML,

X

kod zostaje wys³any w odpowiedzi HTTP do przegl¹darki.

Zajrzyjmy teraz w g³¹b zapytania i odpowiedzi HTTP. Do analizy

samej transakcji HTTP mo¿emy u¿yæ wspomnianej wtyczki ieHTT-
PHeaders przegl¹darki Internet Explorer oraz dwóch funkcji PHP:
apache_request_headers() i apache_response_headers().

Trzeci z przyk³adów zawiera dwa formularze, takie jak formularz

z listingu 1, ró¿ni¹ce siê jedynie wartoœci¹ atrybutu method (czyli
metod¹ przekazywania danych). Skrypt jakis-skrypt.php wywo³uje
funkcje apache_request_headers() i apache_response_headers()
oraz wykorzystuje zmienne predefiniowane REQUEST_METHOD,

HTML/PHP

INTERNET.kwiecieñ.2005

104

NA CD

NEWSY

Z OK£ADKI

FIRMA

MAGAZYN

PROGRAMY

WARSZTAT



REQUEST_URI i SERVER_PROTOCOL (zawarte w tablicy
$_SERVER jako $_SERVER[”REQUEST_METHOD”],
$_SERVER[”REQUEST_URI”] i $_SERVER[”SERVER_PROTO-
COL”]) i wyœwietla szczegó³owe informacje na temat odebranego
zapytania HTTP i wys³anej odpowiedzi.

Natomiast po zainstalowaniu wtyczki ieHTTPHeaders mo¿emy

ca³¹ transakcjê œledziæ na bie¿¹co w oknie przegl¹darki. Po odwie-
dzeniu formularza z pliku get.html, wpisaniu danych i naciœniêciu
przycisku Wyœlij w oknie wtyczki ieHTTPHeaders ujrzymy szczegó-
³y zapytania:

GET /1/jakis-skrypt.php?imie=Aleksander&

©

nazwisko=Macedo%F1ski HTTP/1.1
Accept: image/gif, image/x-xbitmap, image/jpeg,

©

..., */*
Referer: http://localhost/1/formularz.html
Accept-Language: pl
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0;

©

Windows NT 5.1)
Host: localhost
Connection: Keep-Alive

oraz odpowiedzi HTTP:

HTTP/1.1 200 OK
Date: Thu, 17 Feb 2005 09:50:35 GMT
Server: Apache/1.3.29 (Win32) PHP/4.3.9RC3
X-Powered-By: PHP/4.3.9RC3
Keep-Alive: timeout=15, max=98
Connection: Keep-Alive
Transfer-Encoding: chunked
Content-Type: text/html

Jeœli porównamy zapytania wys³ane metod¹ GET i POST, to za-

uwa¿ymy nastêpuj¹ce ró¿nice:

X

w przypadku metody GET:

x

dane zapytania s¹ zakodowane w adresie URL w postaci:

jakis-skrypt.php?imie=Aleksander&nazwisko=Macedo%F1ski

x

adres wyœwietlany przez przegl¹darkê, zawiera informacje
o przekazanych zmiennych;

x

stronê mo¿emy odœwie¿yæ przyciskiem Odœwie¿.

X

w przypadku metody POST:

x

dane zapytania s¹ do³¹czone za nag³ówkami;

x

dane nie s¹ widoczne w polu adres przegl¹darki;

x

odœwie¿anie strony powoduje wyœwietlenie komunikatu.

Pamiêtaj¹c o tym, by – ze wzglêdów bezpieczeñstwa – stosowaæ

wy³¹cznie metodê POST, przejdŸmy do omówienia przyk³adowego
formularza i przetwarzaj¹cego go skryptu.

Przykład formularza – kalkulator

Przygotujmy kalkulator, który dodaje, odejmuje oraz mno¿y dwie licz-
by wprowadzone przez u¿ytkownika. Formularz kalkulatora zawiera
dwie kontrolki INPUT umo¿liwiaj¹ce wprowadzanie liczb oraz przy-
cisk do wysy³ania formularza.

Pierwsze rozwi¹zanie sk³ada siê z dwóch plików. Formularz jest

zapisany w pliku kalkulator-formularz.html, zaœ skrypt przetwarza-
j¹cy – w pliku kalkulator-skrypt.php. Listingi 2 oraz 3 przedstawiaj¹
oba pliki. Uwagê nale¿y zwróciæ na nastêpuj¹ce zagadnienia:

X

Wartoœci¹ atrybutu action jest kalkulator-skrypt.php, wiêc formu-
larz jest przetwarzany przez skrypt kalkulator-skrypt.php.

X

Formularz jest przekazywany metod¹ POST, zatem danych z for-
mularza bêdziemy szukali w tablicy $_POST.

X

Dwie kontrolki formularza przeznaczone na liczby nazywaj¹ siê
liczba1 oraz liczba2 (spójrzmy na atrybuty name kontrolek
INPUT). Liczby wprowadzone przez u¿ytkownika w formularzu
bêd¹ w skrypcie dostêpne jako $_POST[’liczba1’] oraz
$_POST[’liczba1’].

X

Funkcja isset() zwraca informacjê logiczn¹ o tym, czy zmienna
podana jako parametr jest dostêpna. Innymi s³owy: czy wizyta na
stronie odby³a siê za poœrednictwem formularza, czy u¿ytkownik
bezpoœrednio odwiedzi³ plik kalkulator-skrypt.php. Jeœli u¿yt-
kownik pozostawi³ puste pola i nacisn¹³ przycisk Wyœlij, wów-
czas zmienne tablicy $_POST s¹ okreœlone, lecz puste (tzn. funk-
cja isset($_POST[’liczba1’]) zwraca logiczn¹ prawdê oraz zacho-
dzi równoœæ $_POST[’liczba1’] === ””).

– Poniewa¿ u¿ytkownik mo¿e wprowadziæ w formularzu dowolne da-

ne, niekoniecznie liczby, ale tak¿e napisy czy – jak ju¿ wspomnieliœmy
– pozostawiæ pola formularza niewype³nione, zatem stosuj¹c funkcjê
is_numeric() sprawdzamy poprawnoϾ danych z tablicy $_POST.

LISTING 2:

F

ORMULARZ KALKULATORA

<FORM action=”kalkulator-skrypt.php” method=”POST”>
<TABLE>
<TR>

<TD>Pierwsza liczba:</TD>
<TD><INPUT name=”liczba1”></TD>

</TR>
<TR>

<TD>Druga liczba:</TD>
<TD><INPUT name=”liczba2”></TD>

</TR>
<TR>

<TD>&nbsp;</TD>
<TD><INPUT type=”submit” value=”Wyœlij”></TD>

</TR>
</TABLE>
</FORM>

LISTING 3:

S

KRYPT PRZETWARZAJ¥CY FORMULARZ

KALKULATORA

<?php
if (isset($_POST[’liczba1’]) && isset($_POST

©

[’liczba2’])) {

if (is_numeric($_POST[’liczba1’]) &&

©

is_numeric($_POST[’liczba2’])) {

echo ”W formularzu podano liczby {$_POST

©

[’liczba1’]} oraz {$_POST[’liczba2’]}.<BR>”;
echo ”Wyniki dzia³añ:<BR>”;

echo ”{$_POST[’liczba1’]} + {$_POST[’liczba2’]} = ”;

echo $_POST[’liczba1’] + $_POST[’liczba2’];
echo ”<BR>”;

} else {

echo ”B³êdne dane! Jedna lub obie liczby s¹

©

niepoprawne!<BR>”;

}

} else {

echo ”Brak danych! Jedna lub obie liczby nie

©

zosta³y podane!<BR>”;

}
?>

W celu u³atwienia powrotu po wykonaniu obliczeñ do strony za-

wieraj¹cej formularz dodajmy poni¿ej skryptu PHP wykonuj¹cego ob-
liczenia hiper³¹cze:

<A href=”kalkulator-formularz.html”>Powrót</A>

HTML/PHP

INTERNET.kwiecieñ.2005

105

WARSZTAT

PROGRAMY

MAGAZYN

FIRMA

Z OK£ADKI

NEWSY

NA CD



C

M

Y

K

Umieszczanie formularza i skryptu w jednym pliku

Przedstawiony kalkulator mo¿emy wykonaæ zapisuj¹c w jednym pliku
zarówno formularz, jak i skrypt PHP. Nazwijmy ten plik kalkulator.php.

Przetwarzaniem formularza zajmie siê plik kalkulator.php.

Musimy wiêc zmodyfikowaæ wartoœæ atrybutu action elementu
FORM. Jest to jedyna zmiana jak¹ nale¿y wykonaæ. Teraz po
umieszczeniu skryptu poni¿ej formularza i ewentualnej zmianie
nazwy pliku na kalkulator.php otrzymamy skrypt, którego szkie-
let jest przedstawiony na listingu 4. W miejscu wielokropków
nale¿y umieœciæ – bez ¿adnych modyfikacji – kod z listingów 2
oraz 3.

LISTING 4:

K

ALKULATOR

:

FORMULARZ I SKRYPT S¥ ZAPISANE

W JEDNYM PLIKU KALKULATOR

.

PHP

<BODY>
<FORM action=”kalkulator.php” method=”POST”>
...
</FORM>
<HR>
<?php
if (isset($_POST[’liczba1’]) && isset($_POST

©

[’liczba2’])) {
...
}
?>
</BODY>

W przypadku gdy plik zawieraj¹cy formularz zajmuje siê jego

przetwarzaniem, wygodnym mo¿e siê okazaæ u¿ycie zmiennej
$_SERVER[’PHP_SELF’]. Zmienna ta zawiera nazwê (dok³adniej:
wzglêdny adres URL) aktualnie wykonywanego skryptu. Ustalaj¹c
atrybut action nastêpuj¹co:

<FORM action=”<?php echo $_SERVER[’PHP_SELF’];

©

?>” method=”POST”>
...
</FORM>

mo¿emy dowolnie zmieniaæ nazwê pliku, bez koniecznoœci modyfika-
cji atrybutu action.

Korzystanie z zewnętrznych skryptów
do przetwarzania formularza

We wszystkich poprzednich przyk³adach przygotowywaliœmy

zarówno formularz, jak i skrypt przetwarzaj¹cy. Co wiêcej, plik
zawieraj¹cy formularz oraz plik ze skryptem znajdowa³y siê
w tym samym folderze. Dziêki temu wartoœci¹ atrybutu action by-
³a nazwa pliku, w którym zapisano skrypt.

Nie jest to konieczne. Po pierwsze wartoœci¹ atrybutu action

jest adres URL. Wynika z tego, ¿e formularz i skrypt przetwarza-
j¹cy mog¹ znajdowaæ siê w innych folderach, a nawet na innych
serwerach. Po drugie jako wartoœæ atrybutu action mo¿emy podaæ
adres URL skryptu, napisanego przez kogoœ innego.

Jako przyk³ad wykonajmy formularze umo¿liwiaj¹ce wyszuki-

wanie informacji w Google oraz walidacjê kodu HTML i CSS
skryptami znajduj¹cym siê na witrynie W3C.

Formularz umo¿liwiaj¹cy wyszukiwanie informacji w Go-

ogle zosta³ przedstawiony na listingu 5. Skrypt o adresie
http://www.google.com/search

wyszukuje informacje w bazie danych.

Jedyn¹ kontrolk¹ formularza, która umo¿liwia wprowadzanie
danych, jest pole INPUT o nazwie q. Zatem, mówi¹c w jêzyku
PHP, powiedzielibyœmy, ¿e tekst wpisany w formularzu zostaje
przekazany do wyszukiwarki Google w zmiennej $_GET[’q’]
(formularz nie zawiera atrybutu method, zatem stosowana jest
metoda domyœlna GET).

LISTING 5:

F

ORMULARZ DO WYSZUKIWANIA W

G

OOGLE

<FORM action=”http://www.google.com/search”>
<P>
<INPUT type=”hidden” name=”hl” value=”pl”>
<INPUT name=”q” value=”” maxlength=”255”>
<INPUT type=”submit” value=”Szukaj” name=”btnG”>
</P>
</FORM>

Formularze korzystaj¹ce z serwisów waliduj¹cych W3C zo-

sta³y przedstawione na listingach 6 oraz 7. Walidator HTML jest
dostêpny pod adresem http://validator.w3.org/check, zaœ walidator CSS
– http://jigsaw.w3.org/css-validator/validator. Oba formularze s¹ przekazy-
wane metod¹ GET, zaœ adres strony do sprawdzenia jest zawarty
w jedynym polu tekstowym o nazwie uri. Gdyby serwisy walida-
cyjne by³y napisane w PHP (s¹ napisane w Perlu), wówczas do
adresu wprowadzonego w formularzu odwo³alibyœmy siê wyko-
rzystuj¹c zmienn¹ $_GET[’uri’].

LISTING 6:

F

ORMULARZ DO WALIDACJI KODU

HTML

SERWISEM PROWADZONYM PRZEZ

W3C

<FORM action=”http://validator.w3.org/check”>
<P>

HTML: <INPUT type=”text” name=”uri” size=”100”

©

value=””>

<INPUT type=”SUBMIT” value=”SprawdŸ HTML”>
<INPUT type=”hidden” name=”charset” value=”

©

(detect automatically)”>
<INPUT type=”hidden” name=”doctype” value=”

©

(detect automatically)”>
<INPUT type=”hidden” name=”ss” value=””>
<INPUT type=”hidden” name=”outline” value=””>
<INPUT type=”hidden” name=”sp” value=””>
<INPUT type=”hidden” name=”noatt” value=””>

</P>
</FORM>

LISTING 7:

F

ORMULARZ DO WALIDACJI KODU

CSS

SERWISEM PROWADZONYM PRZEZ

W3C

<FORM action=”http://jigsaw.w3.org/

©

css-validator/validator”>
<P>

CSS2: <INPUT type=”text” name=”uri” size=”100”>
<INPUT type=”submit” value=”SprawdŸ CSS”>
<INPUT type=”hidden” name=”warning” value=”1”>
<INPUT type=”hidden” name=”profile” value=”css2”>

</P>
</FORM>

Podsumowanie

Wprawdzie formularze zawarte na witrynach internetowych
przygotowujemy w jêzyku HTML, jednak umiejêtnoœæ faktycz-
nego ich wykorzystania daleko wykracza poza znajomoϾ znacz-
ników. Poznawszy wzajemn¹ relacjê pomiêdzy formularzem
i przetwarzaj¹cym go skryptem, sposób kodowania oraz przesy-
³ania informacji wprowadzonych w formularzu oraz metodê udo-
stêpniania danych pochodz¹cych z formularza przez maszynê
PHP wewn¹trz skryptu zyskujemy nieco szersze spojrzenie na
zagadnienia dotycz¹ce komunikacji u¿ytkownika z aplikacj¹
internetow¹.

n

Ćwiczenia przedstawione w artykule są dostępne na stronie domowej
autora pod adresem

http://www.gajdaw.pl

HTML/PHP

INTERNET.kwiecieñ.2005

106

NEWSY

Z OK£ADKI

FIRMA

MAGAZYN

PROGRAMY

WARSZTAT



NA CD

C

M

Y

K

Apache oraz język WML

Apache jest najpopularniejszym serwerem stron internetowych.
Domyœlnie zosta³ zaprojektowany do obs³ugi jêzyka HTML oraz
wszystkich jego rozszerzeñ. Dlatego te¿ ustawienia Apache musz¹ byæ
zmodyfikowane, aby móc w pe³ni korzystaæ z jêzyka WML.

Jeœli mamy uprawnienia administratora, wystarczy do pliku

httpd.conf dodaæ poni¿szy fragment kodu:

# MIME Types for WAP
# For PHP 4.x, use this:
AddType application/x-httpd-php .wml
# For PHP 3.x, use this:
AddType application/x-httpd-php3 .wml
# For normal WML pages.
AddType text/vnd.wap.wml .wml
# For WML embedded graphics.
AddType image/vnd.wap.wbmp .wbmp
# End MIME Types for WAP

Jeœli nie posiadamy takich uprawnieñ, musimy utworzyæ plik .htac-

cess w katalogu naszego projektu WML, a nastêpnie zapisaæ do niego
zawartoœæ ramki. W ka¿dym katalogu, który ma byæ widziany przez
przegl¹darkê WAP, musi znajdowaæ siê niezale¿ny plik .htaccess.

Specyfikacja języka WML

Tworzenie stron w jêzyku WML nie jest zajêciem trudnym, przypomi-
na budowê serwisów za pomoc¹ jêzyka HTML. Istnieje jednak spora
ró¿nica polegaj¹ca na tym, ¿e sk³adnia WML jest œciœle zdefiniowana
i bazuje na standardzie XML 1.0. Podobnie jak w jêzyku HTML, stro-
ny napisane w WML posiadaj¹ odrêbne rozszerzenie „.wml”.

Formatowanie strony WAP odbywa siê za pomoc¹ odpowiednich

tagów. Dotycz¹ one przede wszystkim rozmieszczenia tekstu, pól for-
mularzy oraz odnoœników. Zastosowanie innych znaczników, które
mog¹ spowolniæ komunikacjê, jest ograniczone. Z tego te¿ powodu
stosowanie du¿ych obrazków oraz tabel powinno byæ omijane.

Poniewa¿ jêzyk WML jest tylko aplikacj¹ standardu XML, sk³ad-

nia znaczników jest œciœle zdefiniowana. Rozró¿niana jest wielkoœæ
znaków (np. <wml> oraz <WML> to dwa ró¿ne tagi), a wszystkie
znaczniki musz¹ byæ poprawnie zamkniête.

Struktura strony WAP oparta jest o talie (ang. Decks) oraz karty

(ang. Cards). Talia to zbiór kart po³¹czonych ze sob¹ za pomoc¹ odno-

œników. To, co widzimy na wyœwietlaczu telefonu komórkowego,
to pojedyncza karta.

W odró¿nieniu od jêzyka HTML, w jednym dokumencie mo¿e znajdo-

waæ siê kilka kart. W czasie odczytywania strony WAP przez telefon ko-
mórkowy wszystkie karty znajduj¹ce siê na stronie zostaj¹ pobrane. Nawi-
gacja pomiêdzy poszczególnymi kartami odbywa siê wy³¹cznie za poœred-
nictwem telefonu, bez potrzeby po³¹czenia z Internetem. Teoretycznie wiêc
w jednym pliku mo¿na zmieœciæ ca³¹ witrynê WAP. Rozwi¹zanie to mo¿e
okazaæ siê b³êdne w przypadku sporych serwisów, gdy¿ pamiêæ telefonu ko-
mórkowego mo¿e nie pomieœciæ tak du¿ej iloœci danych. Dlatego te¿ lepiej
dzieliæ stronê na kilka plików po³¹czonych za pomoc¹ odnoœników.

Standardowa struktura strony WML. Wszystkie istotne fragmenty

kodu zosta³y skomentowane.

L

ISTING

1.

(

STRUKTURA

.

TXT

)

#1. Fragment ten odpowiedzialny jest za przes³anie
odpowiedniego nag³ówka do przegl¹darki WAP. Strona
zosta³a zdefiniowana jako XML. Sekcja DOCTYPE
ustala typ dokumentu na WML. Od tego momentu
wszystkie umieszczone dane musz¹ byæ zgodne z tym
standardem.

WAP

INTERNET.kwiecieñ.2005

107

WARSZTAT

PROGRAMY

MAGAZYN

FIRMA

Z OK£ADKI

NEWSY

NA CD



C

M

Y

K

S T A T Y S T Y K I P R Z E Z

WAP

czyli jak połączyć PHP z językiem WML

Zadaniem tego artyku³u jest zaprezentowanie przydatnoœci protoko³u WAP oraz po³¹czenie

jêzyka WML z dynamicznym PHP. Zdobyta tutaj wiedza pos³u¿y do stworzenia systemu

pobieraj¹cego statystyki z dowolnego serwisu internetowego.

Tomasz Gêbarowski

S

Schemat komunikacji pomiêdzy telefonem komórkowym,

operatorem telefonii komórkowej oraz serwerem WWW

<?xml version=”1.0”?>
<!DOCTYPE wml PUBLIC ”-//WAPFORUM//DTD WML 1.1//EN”
”http://www.wapforum.org/DTD/wml_1.1.xml”>
#2. Ka¿dy dokument WML rozpoczyna siê od znacznika
<wml>. Dopiero poni¿ej tego znacznika mo¿na
definiowaæ karty.
<wml>
#3. Definicja pierwszej karty za pomoc¹ znaczników
<card> </card>. Przekazane parametry informuj¹
o identyfikatorze (id) oraz tytule karty (title).
Wewn¹trz znaczników umieszczono standardowy
paragraf <p></p>, znany tak¿e z jêzyka HTML.
<card id=”Karta1” title=”Przykladowa karta 1”>
<p>
Tutaj jest wlasciwa tresc karty 1
</p>
</card>
#4. Definicja drugiej karty w sposób analogiczny
do karty pierwszej.
<card id=”Karta2” title=”Przykladowa karta 2”>
<p>
Tutaj jest wlasciwa tresc karty 1
</p>
</card>
#5. Zakoñczenie dokumentu WML.
</wml>

Wiêkszoœæ stron WAP, które zostan¹ stworzone w tym artykule,

bêdzie opieraæ siê na powy¿szym schemacie. Podobnie jak w jêzyku
HTML jest on powszechnie stosowany przez twórców stron WAP.
W tej czêœci rozdzia³u zaprezentowane zostan¹ znaczniki WML, które
pozwalaj¹ dostosowaæ oraz uatrakcyjniæ wygl¹d strony.

Formatowanie tekstu

Podobnie jak HTML, jêzyk WML dysponuje pokaŸnym zbiorem
znaczników odpowiedzialnych za formatowanie tekstu. Wiêkszoœæ
z nich znana jest dobrze wszystkim pisz¹cym tradycyjne strony inter-
netowe. Do poznanego w poprzednim przyk³adzie znacznika <p> mo-
¿emy do³¹czyæ tak¿e inne: <em> <b> <i> <u> <big> <small>
<strong>. Ich dzia³anie jest oczywiste, a przyk³adowe zastosowanie
znaczników mo¿na znaleŸæ w kolejnym przyk³adzie (listing 2).

Tabelki

Projektuj¹c jakiekolwiek tabelki nale¿y zastanowiæ siê czy ich wyko-
rzystanie bêdzie s³uszne i niezale¿ne od platformy sprzêtowej. Ró¿no-
rodnoœæ telefonów dostêpnych na rynku mo¿e spowodowaæ, ¿e strona
zostanie wyœwietlona w inny sposób ni¿ zamierza³ autor. W przypadku
tabelek jest to bardzo prawdopodobne. Wystarczy, ¿e rozmiar ekranu
telefonu bêdzie mniejszy od wczeœniej za³o¿onego.

Podobnie jak w jêzyku HTML tabelkê definiujemy znacznikiem

<table>, podaj¹c jako parametr liczbê kolumn. Kolejne rzêdy oraz
kolumny dodaje siê za pomoc¹ znaczników <tr> oraz <td>.

Odnośniki

Istniej¹ dwie metody dodawania odnoœników do dokumentów WML.
Pierwsza z nich znana jest z jêzyka HTML i sprowadza siê do wykorzy-
stania standardowego znacznika <a href=””>. Jako parametr href mo¿na
podaæ adres drugiego pliku WML lub nazwê karty na któr¹ wska¿e odno-
œnik. Przed nazw¹ karty nale¿y umieœciæ znacznik „#”. (ang. hash)

Druga metoda wykorzystuje znacznik <anchor> i jest bardziej

uniwersalna. Zastosowanie znacznika <anchor> wymaga przypisania do
niego zadania. Istniej¹ trzy typy zadañ: „go”, „prev”, „refresh”. Ka¿de
z nich wykonuje inn¹ czynnoœæ. Dla przyk³adu: „go” jest odpowiedni-
kiem znacznika <a href=””> i przesy³a u¿ytkownika pod wskazany adres.

Zadania „prev” oraz „refresh” s¹ odpowiedzialne za powrót do poprzed-
niej strony oraz odœwie¿enie zmiennych przypisanych do karty. Metoda
stosowania znacznika <anchor> zostanie omówiona w listingu 2.

Obrazki

Strona WAP mo¿e zawieraæ proste obrazki i grafiki. Musz¹ one jednak
zostaæ wczeœniej przygotowane i zapisane w formacie WBMP. Inny
rodzaj grafiki nie jest obs³ugiwany. Wstawienie obrazka na stronê
sprowadza siê do wykorzystania znacznika <img>. Jako parametr
„src” nale¿y podaæ adres pliku graficznego. Opcjonalnie mo¿na u¿yæ
tak¿e „alt”, odpowiedzialnego za tekst alternatywny, który pojawi siê
w przypadku, gdy obrazek nie zostanie poprawnie wyœwietlony.

Po tym wstêpie teoretycznym przejdŸmy do stworzenia prostej

strony WAP wykorzystuj¹cej poznane w³aœciwoœci jêzyka WML.
Strona bêdzie siê sk³adaæ z trzech kart. Na pierwszej umieszczone zo-
stanie menu z mo¿liwoœci¹ wyboru jednej z dwóch kart. Jedna z nich
wyœwietli prost¹ tabelkê, druga poka¿e metody formatowania tekstu.

L

ISTING

2.

(

TEKST

_

TABELKA

.

TXT

)

<?xml version=”1.0”?>
<!DOCTYPE wml PUBLIC ”-//WAPFORUM//DTD WML 1.1//EN”
”http://www.wapforum.org/DTD/wml_1.1.xml”>
#1. Rozpoczêcie w³aœciwej czêœci strony.
<wml>
#2. Tutaj znajduje siê pierwsza karta z zawartoœci¹
menu. Pozycje menu zosta³y umieszczone w dwóch
niezale¿nych paragrafach. Jako rodzaj odnoœnika
wybrano <anchor>. Jak widaæ, domyœln¹ akcj¹
jest <go>, która odsy³a u¿ytkownika do wskazanej
karty. Przed nazw¹ nale¿y umieœciæ „#”.
<card id=”Menu” title=”Menu”>

WAP

INTERNET.kwiecieñ.2005

108

NEWSY

Z OK£ADKI

FIRMA

MAGAZYN

PROGRAMY

WARSZTAT



NA CD

C

M

Y

K

S

Menu wyboru skryptu

Statystyki WAP

S

Pobieranie wyników statystyk

zakoñczone sukcesem

<p>
<anchor>Formatowanie
<go href=”#Formatowanie”/>
</anchor>
</p>
<p>
<anchor>Tabela
<go href=”#Tabela”/>
</anchor>
</p>
</card>
#3. W tym miejscu znajduje siê karta „Formatowanie”
prezentuj¹ca ró¿ne metody formatowania tekstu.
Poszczególne napisy zosta³y oddzielone znacznikiem
przejœcia do nowej linii <br/>. Ca³oœæ tekstu
zosta³a umieszczona w paragrafie.
<card id=”Formatowanie” title=”Formatowanie”>
<p>
normalny<br/>
<em>wyt³uszczony</em><br/>
<strong>strong</strong><br/>
<b>pogrubienie</b><br/>
<i>kursywa</i><br/>
<u>podkreœlony</u><br/>
<big>du¿y</big><br/>
<small>ma³y</small>
</p>
</card>
#4. Trzecia karta odpowiedzialna jest
za wyœwietlenie prostej tabelki. Jak widaæ, tabelka
zosta³a umieszczona w nowym paragrafie. Na pocz¹tku
zdefiniowano tak¿e iloœæ kolumn. Projektuj¹c
tabelkê nale¿y wzi¹æ pod uwagê ró¿ne rozmiary
wyœwietlacza w telefonach komórkowych.
<card id=”Tabela” title=”Tabela”>
<p>
<table columns=”3”>
<tr>
<td>Kom 1</td>
<td>Kom 2</td>
<td>Kom 3</td>
</tr>
</table>
</p>
</card>
</wml>

Testowanie stron WAP

Czy mo¿na sprawdziæ poprawnoœæ stron WAP bez potrzeby ³¹czenia
siê z witryn¹ za pomoc¹ telefonu komórkowego? Tak. Wystarczy
pos³u¿yæ siê jednym z emulatorów protoko³u WAP. Do najbardziej po-
pularnych nale¿¹:

X

Nokia WAP Toolkit – http://www.forum.nokia.com,

X

WinWAP 3.0 – http://www.winwap.com,

X

Paj¹czek – najnowsza wersja tego edytora HTML ma wbudowa-
n¹ przegl¹darkê WAP – http://www.pajaczek.pl,

X

Opera – ta przegl¹darka internetowa umo¿liwia ogl¹danie stron
napisanych w jêzyku WML,

X

Gelon.net – testowanie online – http://www.gelon.net.

Statystyki strony przez WAP

W poprzedniej czêœci artyku³u zapoznaliœmy siê z metod¹ tworzenia
prostych stron WAP wykorzystuj¹c¹ jêzyk WML. Przydatnoœæ takich

stron jest znikoma, gdy¿ ca³a zawartoœæ znajduj¹ca siê na nich jest sta-
tyczna i raczej nikomu siê nie przyda. W tej czêœci tekstu po³¹czymy
mobilnoœæ protoko³u WAP razem z dynamik¹ jêzyka PHP. W ten spo-
sób stworzona zostanie aplikacja pozwalaj¹ca na pobranie statystyk
i przes³anie ich do telefonu komórkowego. Poniewa¿ proces ten jest
trochê bardziej skomplikowany, konieczne jest omówienie dwóch istot-
nych zagadnieñ:

X

obs³ugi formularzy za pomoc¹ biblioteki libcurl,

X

wykorzystania wyra¿eñ regularnych (ang. regular expressions)
do odpowiedniego wydobycia interesuj¹cych nas danych z tekstu.

Libcurl – obsługa formularzy

Libcurl to zbiór funkcji umo¿liwiaj¹cych przesy³anie plików i danych
w Internecie. Dziêki jej pomocy mo¿liwy jest transfer formularzy
umieszczonych na innych odleg³ych stronach WWW. W ten sposób
stworzony przez nas skrypt PHP mo¿e odwo³ywaæ siê do danych znaj-
duj¹cych siê w ogólnodostêpnych bazach oraz pobieraæ wyniki odle-
g³ych zapytañ.

Ka¿d¹ aplikacjê wykorzystuj¹c¹ bibliotekê libcurl mo¿na zaplano-

waæ wed³ug nastêpuj¹cego schematu:

X

inicjalizacja sesji libcurl wykonana za pomoc¹ funkcji curl_init(),

X

ustawienie podstawowych parametrów (takich jak pola oraz adres
formularza) za pomoc¹ funkcji curl_setopt,

X

wykonanie wszystkich ustawieñ w obrêbie sesji za pomoc¹ funk-
cji curl_exec(),

X

zamkniêcie sesji libcurl za pomoc¹ funkcji curl_close().

Najtrudniejszym zadaniem podczas tworzenia aplikacji wykorzy-

stuj¹cych libcurl jest zdefiniowanie odpowiednich pól formularza,
które zostan¹ wys³ane do skryptu. Zawsze istnieje bowiem ryzyko, ¿e
skrypt wykryje fakt, i¿ zapytanie przesy³a automat, a nie u¿ytkownik.

W skrypcie do statystyk biblioteka libcurl zostanie wykorzystana

do zalogowania siê do systemu (za pomoc¹ metody POST) i pobrania
strony z rezultatem.

Podstawy wyrażeń regularnych

Wyra¿enia regularne (ang. regular expressions) to wzorce, które opisu-
j¹ ³añcuchy symboli i znaków. Wyra¿enia regularne mog¹ okreœlaæ
zbiór pasuj¹cych ³añcuchów, mog¹ równie¿ wyszczególniaæ istotne
czêœci ³añcucha.

Dwie najpopularniejsze sk³adnie wyra¿eñ regularnych to sk³adnia unik-

sowa i sk³adnia perlowa. Ta druga jest znacznie bardziej rozbudowana.

Tworz¹c jakiekolwiek wyra¿enia regularne nale¿y pamiêtaæ o ich

kilku istotnych cechach:

X

ka¿dy znak oprócz znaków specjalnych okreœla sam siebie, np.
„x” okreœla ³añcuch z³o¿ony ze znaku „x”,

X

kolejne symbole znajduj¹ce siê w ³añcuchu bêd¹ interpretowane
jeden po drugim np. „xl” oznacza, ¿e ³añcuch musi sk³adaæ siê
z litery „x” poprzedzaj¹cej literê „l”,

X

kropka „.” oznacza dowolny znak z wyj¹tkiem znaku nowego
wiersza,

X

zastosowanie znaku odwrotnego ukoœnika umo¿liwia umieszcze-
nie znaków specjalnych (na przyk³ad kropki \. , ukoœnika \\ ,
nawiasu \) itp.,

X

daszek „^” na pocz¹tku zestawu oznacza wszystkie znaki oprócz
tych zawartych w zestawie,

Nawiasy okr¹g³e ( x ) grupuj¹ symbole. Dziêki ich zastosowaniu

mo¿liwe jest odwo³anie siê do poszczególnych elementów w dalszej
czêœci wyra¿enia (za pomoc¹ operatora \1 , \2 , \3 itd.),

Dokładny opis biblioteki libcurl znajduje się w MI 9/2004. W tym
miejscu zostały przedstawione tylko najważniejsze cechy i funkcje
biblioteki.

WAP

INTERNET.kwiecieñ.2005

109

WARSZTAT

PROGRAMY

MAGAZYN

FIRMA

Z OK£ADKI

NEWSY

NA CD



C

M

Y

K

X

znaki umieszczone pomiêdzy nawiasami kwadratowymi
oznaczaj¹ dowolny znak objêty nawiasami kwadratowymi,
np.: „[opr]” oznacza o, p lub r. Mo¿na u¿ywaæ tak¿e prze-
dzia³ów np. [a-z]. Jeœli uwzglêdnione maj¹ byæ tak¿e wielkie
litery oraz cyfry, to wyra¿enie musi wygl¹daæ w ten sposób
[a-zA-z0-9],

X

wed³ug sk³adni perlowej dowolna cyfra mo¿e zostaæ zast¹piona
wyra¿eniem „\d”. Wszystkie elementy, które nie s¹ cyframi ozna-
czone s¹ jako „\D”.

Nawiasy kwadratowe oznaczaj¹ pojedyncze wyst¹pienie dowolne-

go znaku znajduj¹cego siê pomiêdzy nawiasami. Mo¿liwe jest zastoso-
wanie wy¿ej wymienionego schematu dla kilku lub wiêcej wyst¹pieñ.
Poni¿sza tabelka prezentuje zastosowanie operatorów do powielenia
schematów.

Statystyki WAP – schemat projektu

Po wstêpie do libcurl oraz wyra¿eñ regularnych przyszed³ czas na
stworzenie bardziej u¿ytecznej aplikacji pobieraj¹cej statystyki z wy-
branego serwisu.

Ca³oœæ projektu zostanie podzielona na trzy pliki. Pierwszy z nich

bêdzie wyœwietla³ menu stworzone za pomoc¹ jêzyka WML, widoczne
z poziomu telefonu komórkowego. Zadaniem drugiego modu³u bêdzie
pobranie aktualnych danych statystyk z serwisu, obrobienie ich za po-
moc¹ wyra¿eñ regularnych oraz zapisanie odpowiednich wyników do
pliku tekstowego. Ostatni modu³ pos³u¿y do odczytania wczeœniej
stworzonego pliku tekstowego i wyœwietlenia danych na telefonie
komórkowym.

Tworz¹c skrypt mo¿na wybraæ dowoln¹ stronê na której znajduj¹

siê statystyki. W artykule za przyk³ad pos³u¿y serwis Cashbill.pl, który
oferuje mo¿liwoœæ zarabiania na us³ugach SMS Premium oraz mikro-
p³atnoœciach.

Tworzenie menu projektu (plik: index.wml)

Prace nad projektem rozpoczynaj¹ siê od stworzenia pliku zawieraj¹-
cego menu ³¹cz¹ce wszystkie modu³y systemu za pomoc¹ odnoœni-
ków. Proces tworzenia podobnego menu zosta³ przedstawiony

FUNKCJE PHP DO OBSŁUGI WYRAŻEŃ REGULARNYCH
preg_match
Zadaniem funkcji jest odnalezienie wskazanego wzorca „pattern” w da−
nym łańcuchu znaków „subject”. Ponadto funkcja zlicza ilość wystąpień
wzorca, a także zapisuje łańcuch znaków pasujący do wzorca w tablicy
„matches”. Cały dopasowany wzorzec znajduje się pod indeksem zero
tablicy „matches”. Kolejne indeksy zawierają składowe części głównego
wzorca. Składnia:

mixed preg_match ( string pattern, string

©

subject , array matches)

preg_replace
Zadaniem funkcji jest odnalezienie wskazanego wzorca „pattern” i zastą−
pienie go odpowiednikiem znajdującym się w zmiennej „replecament”.
Wszystkie operacje przeprowadzane są na łańcuchu znaków znajdującym
się w zmiennej „subject”.
Funkcja preg_replace zwraca zmodyfikowany łańcuch znaków. Składnia:

mixed preg_replace ( mixed pattern, mixed

©

replacement, mixed subject [, int limit])

Operator

Działanie

Przykład

?

Dowolny znak występuje w łańcuchu zero lub

–?

więcej razy.

*

Znak umieszczony w nawiasach kwadratowych

[A−Z]*

(przed operatorem) występuje w łańcuchu zero
lub więcej razy.

+

Znak umieszczony w nawiasach kwadratowych

[0−9]+

(przed operatorem) występuje co najmniej raz.

w poprzedniej czêœci artyku³u. Poni¿ej znajduje siê kod ze szczegó³o-
wymi komentarzami.

L

ISTING

3

(

INDEX

.

WML

)

#1. Wys³anie odpowiednich nag³ówków do przegl¹darki
WAP. W odró¿nieniu od poprzednich deklaracji, czêœæ
nag³ówka przesy³ana jest za pomoc¹ funkcji header().
<? header(”Content-type: text/vnd.wap.wml”); ?>
<?xml version=”1.0”?>
<!DOCTYPE wml PUBLIC ”-//WAPFORUM//DTD WML 1.1//EN\”

©

”http://www.wapforum.org/DTD/wml_1.1.xml”>
#2. W³aœciwy kod WML. Stworzenie jednej karty
zawieraj¹cej menu. W dwóch osobnych paragrafach
umieszczono pozycje menu. Odnoœniki wskazuj¹ osobne
pliki PHP, a nie inne zak³adki.
<wml>
<card id=”card1” title=”Menu”>
<p> Wybierz: </p>
<p>

<a href=”show.php”> Ostatnie wyniki</a>

</p>
<p>

<a href=”get.php”> Pobierz dane </a>

</p>
</card>
</wml>

Pobieranie statystyk (plik: get.php )

Jest to z pewnoœci¹ najtrudniejszy fragment projektu, który wymaga
nie tylko znajomoœci WML, ale tak¿e wyra¿eñ regularnych oraz pod-
staw biblioteki libcurl. Przede wszystkim modu³ ten musi zrealizowaæ
nastêpuj¹ce zadania:

X

zalogowaæ siê do systemu Cashbill.pl,

X

pobraæ stronê z wynikami logowania,

X

przetworzyæ dane znajduj¹ce siê na niej,

X

zapisaæ odpowiednio sformatowane dane do pliku,

X

wyœwietliæ stronê WAP informuj¹c¹ o zakoñczeniu czynnoœci.

L

ISTING

4

(

GET

.

PHP

)

#1. Wys³anie danych nag³ówka informuj¹cych
przegl¹darkê WAP o rodzaju przesy³anych danych.
<?
header(”Content-type: text/vnd.wap.wml”);
#2. Deklaracja zmiennych potrzebnych podczas
pobierania danych za pomoc¹ biblioteki libcurl.
Zmienna $url zawiera adres formularza z logowaniem
do systemu. Czêœæ danych przes³ana jest za pomoc¹
metody GET (wymaga tego system). Ustawienie
zmiennej $postdata zawieraj¹cej ³añcuch znaków
z wartoœciami pól formularza. W tym miejscu
nale¿y umieœciæ dane potrzebne do zalogowania.
Niektóre systemy wymagaj¹ równie¿ ustawienia
parametru $user_agent_string, który informuje
o typie przegl¹darki wysy³aj¹cej formularz.
Jest to jedna z metod zabezpieczenia formularzy
przed automatami. W tym miejscu staramy siê
j¹ obejœæ.
Zmienna referer ma podobne zastosowanie
jak $user_agent_string – informuje o adresie
z którego nast¹pi³o wejœcie na stronê.
$url = ”http://www.cashbill.pl/ui/xxx/?ttheme=

©

subwindow&main=stat&sub=d0zer&nosub=&progress=

©

&nocash=&site=&sx=&sy=”;

WAP

INTERNET.kwiecieñ.2005

110

NEWSY

Z OK£ADKI

FIRMA

MAGAZYN

PROGRAMY

WARSZTAT



NA CD

C

M

Y

K

$postdata = ”user=uzytkownik&pass=haslo&action=

©

login&login=wejdŸ”;
$user_agent_string = ”Mozilla/4.0 (compatible;

©

MSIE 6.0; Windows 98)”;
$referer = ”http://www.cashbill.pl”;
#3. Inicjalizacja, ustawienie niezbêdnych opcji
oraz wykonanie zapytania przez bibliotekê libcurl.
Proces pobierania danych mo¿e byæ czasoch³onny,
wiêc nale¿y pamiêtaæ o ustawieniu wartoœci TIMEOUT
na mo¿liwie du¿¹. Wyniki zapytania zapisane
s¹ w zmiennej $result.
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL,$url);
curl_setopt($ch, CURLOPT_USERAGENT,

©

$user_agent_string);
curl_setopt($ch, CURLOPT_REFERER,$referer);
curl_setopt($ch, CURLOPT_FAILONERROR, 1);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
curl_setopt($ch, CURLOPT_TIMEOUT, 1000);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $postdata );
$result = curl_exec($ch);
curl_close($ch);
#4. Zdefiniowanie dwóch wyra¿eñ regularnych
pobieraj¹cych ca³kowit¹ iloœæ zarobionych pieniêdzy
oraz liczbê kredytów SMS. Wzór sprawdza czy w tekœcie
znajduje siê s³owo kluczowe („bilans” lub „Kredyty”),
nastêpnie poszukuje ci¹gu odpowiednich znaczników
HTML oraz liczby w formacie (+/– liczba.liczba ),
zakoñczonej symbolem PLN.
$html_regex_income = ’bilans: <b>(-?\d+\.\d+) PLN’;
$html_regex_sms = ’Kredyty<\/td><td><b>

©

(-?\d+\.\d+) PLN’;
#5. Wykorzystanie zdefiniowanych wzorców
do pobrania odpowiednich informacji ze zmiennej
$result (zawieraj¹cej wyniki logowania). Funkcja
preg_match zapisuje wszystkie wyst¹pienia wzorca
w tablicach $income oraz $sms.
preg_match(”/$html_regex_income/I”, $result , $income);
preg_match(”/$html_regex_sms/I”, $result , $sms);
#6. Dane zapisane w zmiennych nie zosta³y jeszcze
poprawnie sformatowane, gdy¿ zawieraj¹ zbêdne
znaczniki HTML oraz s³owa. W tym miejscu nastêpuje
wyodrêbnienie liczb i ich ponowny zapis do tabeli.
W wyra¿eniu regularnym u¿yto operatora \${1},
który odwo³uje siê do wyniku poprzedniego wyra¿enia
zawartego w zmiennych $html_regex_income
oraz $html_regex_sms.
$income[0] = preg_replace(”/$html_regex_income/I”,

©

”Zarobek: \${1} PLN”, $income[0]);
$sms[0] = preg_replace(”/$html_regex_sms/I”,

©

”SMS: \${1} PLN”, $sms[0]);
#7. Pobranie aktualnej daty i czasu oraz zapisanie
wszystkich sformatowanych danych do zmiennej $data.
$date = date(”Y.m.d”) . ”|” . date(”H:m:s”);
$data = $income[0] . ”<br/>” . $sms[0] .

©

”<br/><br/> Aktualizowane: ” . $date;
#8. Utworzenie pliku ”stats.dat” oraz skopiowanie
do niego zawartoœci zmiennej $data.
$fp = fopen(”stats.dat”, ”w+”);
fwrite($fp,$data);
fclose($fp);

#9. Wyœwietlenie strony WAP informuj¹cej o pobraniu
danych oraz mo¿liwoœci powrotu do menu lub podgl¹du
statystyk. Wszystkie techniki zastosowane w tym
fragmencie kodu zosta³y ju¿ wczeœniej omówione.
echo ”
<?xml version=\”1.0\”?>
<!DOCTYPE wml PUBLIC \”-//WAPFORUM//DTD WML 1.1//EN\”

©

\”http://www.wapforum.org/DTD/wml_1.1.xml\”>
<wml>
<card id=\”card2\” title=\”Pobierz wyniki\”>

<p> Dane pobrane </p>
</br>
<a href=\”show.php\”> Pokaz </a> </br>
<a href=\”index.wml\”> Wstecz </a>

</card>
</wml>”;
?>

Podgląd statystyk (plik. show.php)

Najwa¿niejszy fragment skryptu zosta³ ju¿ opracowany. Dane s¹ sfor-
matowane oraz zapisane w pliku „stats.dat”. Teraz przyszed³ czas, aby
je odczytaæ i wyœwietliæ. To jest w³aœnie g³ówne zadanie modu³u
show. Poni¿ej znajduje siê kod Ÿród³owy, najwa¿niejsze miejsca zosta-
³y skomentowane.

L

ISTING

5

(

SHOW

.

PHP

)

<?
header(”Content-type: text/vnd.wap.wml”);
#1. Otworzenie pliku „stats.dat” oraz odczytanie
danych znajduj¹cych siê w nim.
$fp = fopen(”stats.dat”, ”r”);
$content = fread ($fp, filesize(”stats.dat”));
fclose ($fp);
#2. Wyœwietlenie dokumentu WAP zawieraj¹cego dane
pobranych statystyk oraz mo¿liwoœæ powrotu do menu
g³ównego. Kod WML zosta³ umieszczony wewn¹trz
funkcji echo. Nale¿y wiêc pamiêtaæ o zamianie
znaków ” na ich odpowiednik \”. Jest to jeden
z czêstszych b³êdów pope³nianych
przez pocz¹tkuj¹cych programistów.
echo ”
<?xml version=\”1.0\”?>
<!DOCTYPE wml PUBLIC \”-//WAPFORUM//DTD WML 1.1//EN\”

©

\”http://www.wapforum.org/DTD/wml_1.1.xml\”>
<wml>
<card id=\”card2\” title=\”Pokaz wyniki\”>
<p> $content </p>
<a href=\”index.wml\”> Wstecz </a>
</card>
</wml>”;
?>

Zakończenie

Po³¹czenie jêzyka PHP oraz podstaw protoko³u WAP pozwala na
stworzenie stron oraz skryptów, których wyniki dostêpne s¹ tak¿e
dla platform przenoœnych. Za pomoc¹ tego artyku³u stworzenie
aplikacji informuj¹cej nas przez telefon komórkowy o pogodzie,
liczbie odwiedzin serwisu, statystykach lub poczcie nie powinno
byæ problemem. Teraz ka¿dy mo¿e œmia³o wyje¿d¿aæ na wakacje,
a najwa¿niejsze dane dotycz¹ce firmy lub serwisu bêd¹ dostêpne
przez protokó³ WAP. Wiêkszoœæ telefonów dostêpnych na rynku
posiada implementacjê WAP i bez problemów powinna wspó³pra-
cowaæ z napisanymi przez nas skryptami.

n

WAP

INTERNET.kwiecieñ.2005

111

WARSZTAT

PROGRAMY

MAGAZYN

FIRMA

Z OK£ADKI

NEWSY

NA CD



C

M

Y

K