E-biznes Blog - Paweł Krzyworączka - e-marketing, e-commerce, pozycjonowanie, reklama internetowa
javascript ajax

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).

Dodaj komentarz

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

70 sposobów na rozkochanie Klienta - książka

O mnie

Nazywam się Paweł Krzyworączka. Ale znajomi mówią na mnie Krzywy. A to jest mój subiektywny blog o e-biznesie (-;

Polecam DIVI

szablony wordpress divi

Moje e-sklepy

Staram się przekazywać maksymalnie praktyczną wiedzę o e-biznesie, e-commerce. Taki mandat staram się uzyskać przez prowadzenie własnych e-sklepów. Oto wybrane z nich:
Akcesoria do tabletu – sklep Tabletoid.pl – to nasz główny sklep, kilka tysięcy produktów, akcesoria do tabletów i telefonów.
Tablety akcesoria – sklep Senio.pl – to nasz drugi, główny e-sklep, nieco inna strategia sprzedażowa.

Preferencje plików cookies

Inne

Inne pliki cookie to te, które są analizowane i nie zostały jeszcze przypisane do żadnej z kategorii.

Niezbędne

Niezbędne
Niezbędne pliki cookie są absolutnie niezbędne do prawidłowego funkcjonowania strony. Te pliki cookie zapewniają działanie podstawowych funkcji i zabezpieczeń witryny. Anonimowo.

Reklamowe

Reklamowe pliki cookie są stosowane, by wyświetlać użytkownikom odpowiednie reklamy i kampanie marketingowe. Te pliki śledzą użytkowników na stronach i zbierają informacje w celu dostarczania dostosowanych reklam.

Analityczne

Analityczne pliki cookie są stosowane, by zrozumieć, w jaki sposób odwiedzający wchodzą w interakcję ze stroną internetową. Te pliki pomagają zbierać informacje o wskaźnikach dot. liczby odwiedzających, współczynniku odrzuceń, źródle ruchu itp.

Funkcjonalne

Funkcjonalne pliki cookie wspierają niektóre funkcje tj. udostępnianie zawartości strony w mediach społecznościowych, zbieranie informacji zwrotnych i inne funkcjonalności podmiotów trzecich.

Wydajnościowe

Wydajnościowe pliki cookie pomagają zrozumieć i analizować kluczowe wskaźniki wydajności strony, co pomaga zapewnić lepsze wrażenia dla użytkowników.