subiektywnie o e-biznesie

JavaScript i AJAX – podstawy

JavaScript i AJAX – podstawy

JavaScript a PHP

Po raz kolejny przytoczę słowa, które jakiś czas temu usłyszałem: "po co mam się uczyć javascript – wolę php" – niestety tego typu stwierdzenia widziałem na różnych forach. Takie stwierdzenia wynikają, jak wspominałem przy HTMLu, z pewnej niewiedzy osób, które tak mówią. Tak naprawdę ciężko porównać PHP z JS, o ile w ogóle można to zrobić. Jeśli chodzi o sam "sposób programowania", to jak dla mnie JS w wielu kwestiach jest bardzo wygodny, kiedy uczyłem się tego języka miałem wrażenie bardzo dużego podobieństwa do programowania w środowisku Borland Builder czy też we Flashu, ale to inna bajka. Programowanie w JS dla mnie w każdym razie jest bardzo przyjemne, chociaż muszę przyznać, że programowanie obiektowe (w sensie budowy klas / obiektów itd.) z początku może wydawało mi się "dość porąbane" (takie odniosłem wrażenie ucząc się tego, a znając już obiektowe PHP czy C++).

No ale nie skupiajmy się na takich sprawach, tylko na zastosowaniu.

Odnosząc się do stwierdzenia, o którym napisałem w pierwszym zdaniu – są pewne rzeczy, które możemy zrobić zarówno we wspomnianym PHP jak i JS, jak choćby jakieś sprawdzenie przeglądarki użytkownika. Czasem trzeba się zastanowić, które rozwiązanie jest lepsze, ale to zależy od sytuacji i każdy na pewno z czasem nabierze do tego umiejętności i wprawy. Generalnie jednak nie ma co porównywać tych dwóch technologii, bo każda z nich sprawdza się doskonale w innych "momentach".

Czym jest JavaScript?

JavaScript jest technologią do tworzenia stron statycznych – czyli kod JS jest interpretowany przez naszą przeglądarkę, a nie przez serwer. Tak więc kod napisany w JS można podejrzeć i trzeba zadać sobie pytanie: czy to dobrze czy też źle? Nie będę się nad tym rozwodził, ale polecam poczytać o bezpieczeństwie. Powiem tylko tyle, że poprzez wprowadzenie z "zewnątrz" kodu JS do naszego serwisu, można doprowadzić do działań nieporządnych (np. uzyskanie czyjegoś klucza sesji), dlatego warto pamiętać o odpowiednim filtrowaniu danych z zewnątrz. Drażniące może być też to, że ktoś może nam najnormalniej "zakosić" taki skrypt, nad którym siedzieliśmy kupę czasu – taki kod można jednak zaszyfrować – tutaj znowu odsyłam do poszukania informacji w Necie.

Przejdźmy do sprawy istotnej moim zdaniem.

Java Script i Ajax

JavaScript i Ajax to nieocenione narzędzie do pewnych zadań, pozwala na wykonywania określonych celów interaktywnie, bez przeładowania strony. Prosty przykład: jakiś formularz. Mamy sobie pola nazwa użytkownika, e-mail, nr gadu-gadu i kod wyświetlonego tokena (obrazek z kodem do przepisania). Przypuśćmy, że jest to tylko PHP – ktoś wypełnia i po przeładowaniu strony pojawiają się mu informacje, że nazwa użytkownika jest za długa, format podanego maila jest zły, nr gadu gadu to nie liczba, a kod z tokena wpisano niepoprawnie – no cóż, trzeba wypełniać wszystko jeszcze raz, pół biedy jak pól formularza jest bardzo mało czy też ktoś mądrze pomyślał i wpisał w pola formularza atrybuty value="<php echo $_POST[nazwapola]; ?>" – wtedy nasze wypełnienie nadal jest wpisane, ale czy nie można by było tego zrobić dużo przyjemniej? Pewnie, że tak! I tutaj właśnie z pomocą przychodzi nam JS czy Ajax. Piszemy sobie prostą funkcję, która będzie wywoływana dla zdarzenia onsubmit naszego formularza i sprawdzi pod odpowiednim kątem jego pola. Tak więc dla opisanego przykładu – sprawdzi czy czasem wpisane imię i nazwisko nie jest za długie, dzięki wyrażeniem regularnym sprawdzi format podanego adresu poczty elektronicznej, sprawdzi czy podany gg to liczba oraz czy wpisany kod zgadza się z tym wygenerowanym (który przykładowo jest zakodowany i zapisany w jakimś ukrytym polu). Jeśli coś będzie nie tak, pojawi się nam na ekranie alert z informacją, co jest jeszcze niepoprawnie wypełnione – czy to nie przyjazne i profesjonalne rozwiązanie?

Można by było jednak wprowadzić pewną modyfikacją, napisać funkcję, która będzie działać na polu gdzie podajemy imię i nazwisko – wywołamy ją zawsze, kiedy zwolniony zostanie klawisz, czyli onkeyup – sprawdzone zostanie czy podane dane nie są za długie, a konkretnie zadziała to tak, że będzie możliwe wpisanie do danego pola jedynie ciągu o długości np. 40 znaków (bo w bazie mamy jakieś pole typu varchar(40)) – jeżeli wpiszemy więcej to "nadmiar" zostanie po prostu usunięty. Czy to nie fajne, taka interaktywność? Również troszkę inaczej moglibyśmy postąpić z naszym sprawdzeniem kodu tokena – czyli obrazka z losowo wygenerowanym napisem. Tutaj zastosowalibyśmy Ajax – również bardzo przydatna technologia (tak generalnie to Ajax to pewne stosowanie technologii razem, sam w sobie nie jest technologią), dzięki której możemy mocno wzbogacić nasz serwis. Krótko mówiąc: Ajax pozwala na wykonanie skryptu po stronie serwera (na przykład PHP) jakby "w tle", czyli podczas tego, kiedy my sobie coś tam robimy na stronie, wykonywany jest jakiś skrypt (to nie przeszkadza nam w tym, co robimy), a następnie do naszej strony zostają wczytane jego rezultaty. I tak na przykład nasz token zapisuje w bazie danych id sesji danego odwiedzającego oraz zakodowany czy też nie tekst na obrazku, kiedy spróbujemy wysłać formularz – ajax wywoła skrypt, który sprawdzi czy podany kod się zgadza.

Podsumowanie

To bardzo prosty przykład zastosowania JS czy też Ajax. Warto jednak zdawać sobie sprawę, że są to technologie niezwykle przydatne z dużymi możliwościami, chociaż też nie powinno się przesadzać z ładowaniem Ajaxa w stronę (po raz kolejny odsyłam do poszukania informacji w Necie). Często ludzie tworzą dynamiczne menu, zmieniające zawartość bloki w odstępach czasowych, powoli pojawiające się animowane elementy, elementy ruchome oraz takie, które można przeciągać (poczytajcie o drag & drop) za pomocą Flasha nie zdając sobie sprawy, że często takie efekty można uzyskać dzięki wymienionym technologiom (polecam poczytać o frameworku jQuery dla JS).

Wyślij komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *

Uwaga: zasady rozsądnego komentowania.
1. Daruj sobie komentarze typu "Dobry wpis", "Gratulacje! link.pl" itp.
2. Komentuj tak, jakbyś chciał, aby u Ciebie komentowano.
3. Podawaj w formularzu Twój prawdziwy adres e-mail (jest bezpieczny!)
4. Link do Twojej strony WWW (w podpisie) pokaże się dopiero wtedy, gdy napiszesz 5-ty komentarz na ebiznesy.pl. Pamiętaj jednak, aby zawsze podawać ten sam adres mailowy (komentarze zliczane są właśnie po mailu).