Ajax zajmuje wysokie miejsce w najważniejszych powodach, dla których warto używać jQuery. JQuery nie tylko rozwiązuje problemy z różnymi przeglądarkami, ale także sprawia, że składnia jest bardzo łatwa w użyciu i zrozumieniu.
W tym filmie próbujemy wyjaśnić, czym w ogóle jest Ajax. Patrzymy na element formularza, który po przesłaniu wysyła żądanie GET lub POST (zgodnie z atrybutem metody) na określony adres URL (określony przez atrybut akcji). To tylko HTML, w ogóle nie ma tam kodu zaplecza ani JavaScript. Ale to przesłanie spowoduje zmianę strony, dosłownie ponowne załadowanie pod nowym adresem URL, tak jak kliknięcie linku.
Ajax pozwala nam wykonać żądanie GET lub POST w tle, bez przeładowywania strony. W istocie o to właśnie chodzi w Ajaxie. Jest bardzo potężny. W dużej mierze odpowiada za to, dlaczego nowoczesne witryny internetowe działają i czują się tak, jak działają.
Ajax zwykł „oznaczać” asynchroniczne JavaScript i XML, ale obecnie jest to w dużej mierze ignorowane, ponieważ nie oznacza to wiele. Stąd też dekapitalizacja. Czasami możesz również zobaczyć „XHR”, które jest skrótem od XMLHttpRequest, który jest natywną technologią podstawową Ajax.
Różnica między GET i POST jest zasadniczo taka: GET służy do uzyskiwania informacji i nie powinien być odpowiedzialny za zmianę danych, a POST służy specjalnie do zmiany danych. Możesz przeczytać więcej na ten temat w tym wątku StackOverflow.
Wykonanie żądania GET w jQuery jest niezwykle łatwe:
$.get( "URL", function(data) ( // do something with data )); ));Adres URL to miejsce, z którego chcesz uzyskać dane. Drugi parametr to funkcja zwrotna, która działa, gdy żądanie Ajax zakończyło się pomyślnie. Najważniejszym parametrem jest pierwszy z nich, dane, w którym znajdują się informacje, które uzyskał z żądania.
Żądania Ajax mogą czasami kończyć się niepowodzeniem. Jedną z przyczyn tego niepowodzenia może być sama przeglądarka i jej zasady bezpieczeństwa. W samych przeglądarkach są zapisane zasady określające, skąd można żądać treści. Żądania można zawsze kierować do tej samej domeny, z której pochodzi żądanie. Ale jeśli w grę wchodzi inna domena, ta inna domena będzie musiała na to zezwolić.
Możesz przeczytać wszystko na ten temat na stronie enable-cors.org. CORS to skrót od „Cross-Origin Resource Sharing”. Patrzymy na przykład, w którym CORS nie jest włączony, a żądanie Ajax kończy się niepowodzeniem. Jednym standardowym i łatwym sposobem naprawienia tego, zakładając, że serwer jest Apache, jest ustawienie nagłówka, który w szczególności zezwala na CORS przez plik .htaccess:
Header set Access-Control-Allow-Origin "*"W filmie po prostu przenosimy żądanie Ajax do CodePen, który domyślnie dobrze obsługuje Ajax.
Łatwy serowy:
Zobacz Pen fBInl autorstwa Chrisa Coyiera (@chriscoyier) na CodePen