AJAX Marek Hołówko Maciej Wojciechowski.

Slides:



Advertisements
Podobne prezentacje
20041 Projektowanie dynamicznych witryn internetowych Paweł Górczyński ASP 3.0.
Advertisements

WEB SERVICE Stefan Rutkowski.
Polsko-Japońska Wyższa Szkoła Technik Komputerowych
ASP.NET 2.0 AJAX Extensions 1.0
Technologie XML Mgr inż. Michał Jaros Technologie XML wykład 1.
Technologie XML Mgr inż. Michał Jaros Technologie XML wykład 3.
(Content Management System)
Aplikacje w sieciach Internet/Intranet
Aplikacje ASP.NET Arkadiusz Twardoń ZTiPSK
PHP vs. ASP PHP – lider wydajności wśród języków skryptowych.
Dokumentowanie wymagań w języku XML
Eclipse jako IDE III a.
Opiekun : dr Piotr Gronek Tomasz Kawęcki 1 Temat pracy.
Systemy zarządzania treścią CMS
Warszawska Wyższa Szkoła Informatyki Warszawa 2007
KURS Z INFORMATYKI prowadzący: mgr Przemysław Głowacki.
1/18 LOGO Profil zespołu. 2/18 O nas Produkcja autorskich rozwiązań informatycznych dla małych i średnich firm w zakresie systemów: Baz danych Aplikacji.
Made by Mateusz Szirch Kilka słów o JavaScript.
Jakub Binkowski Visual C# MVP webEFS sp.j.. GET i POST.
Rozwój aplikacji przy wykorzystaniu ASP.NET
Aplikacje Internetowe
System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych Łukasz Przywarty
Web Serwisy w praktyce Technologie internetowe ( )
Działanie strony internetowej
Systemy zarządzania treścią Wykład 1
Rozwój aplikacji. To zestaw narzędzi do budowania i optymalizacji złożonych aplikacji opartych na przeglądarce. To zestaw narzędzi do budowania i optymalizacji.
P ISZ MNIEJ, RÓB WIĘCEJ - ZASTOSOWANIE J Q UERY Kamil Szumański s4126.
* HTML5 i CSS3 w nowoczesnych serwisach internetowych
Opracował : Przemysław Drzymała
Ewolucja stron WWW Historia Informatyki.
Microsoft Dynamics CRM jako platforma deweloperska
Tworzenie strony internetowej krok po kroku.
Arkadiusz Twardoń ZTiPSK
Autor: Kamil Szafranek
Tworzenie aplikacji webowych w oparciu o framework ObjectLedge
Tworzenie Aplikacji Internetowych dr Wojciech M. Gańcza 8.
Internetowe surfowanie
Specjalizacja "Dziennikarstwo On-line„ asynchroniczny JavaScript i XML – AJAX Część 6 Prowadzący: Dariusz Jaruga
ZAKŁAD SYSTEMÓW KOMPUTEROWYCH
Specjalizacja "Dziennikarstwo On-line„ HTML – XHTML – Warsztat Prowadzący: Dariusz Jaruga
Projektowanie stron WWW
Specjalizacja "Dziennikarstwo On-line„ HTML – XHTML część 1 Prowadzący: Dariusz Jaruga
W W W Łukasz Stochniał.
Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska.
Projektowanie Aplikacji Internetowych
Temat 1: Ogólne cechy języka PHP
Technologie programowania systemów internetowych
Temat 3: Okno dialogowe.
Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska.
Technologie internetowe Wykład 5 Wprowadzenie do skrytpów serwerowych.
Andrzej Majkowski 1 informatyka +. 2 Bezpieczeństwo protokołu HTTP Paweł Perekietka.
HTML Hyper Text Markup Language komputerowe Esperanto cz. I historia, struktura dokumentu.
Obiekty DOM.
Podstawy języka skryptów
JQuery.
Piotr Czapiewski Wydział Informatyki ZUT. Web Services Description Language.
Iga Lewandowska I EMII MU
1. Podaj definicję kartografii internetowej. 2. Geographic Markup Language: a) Jest schematem XML a) Opisuje obiekty w fizycznej przestrzeni a) Jest formatem.
INTERNET jako „ocean informacji”
Temat: Porównanie technologii php,c# oraz javascript na przykładzie webaplikacji typu społecznościowy agregator treści Autor: Wojciech Ślawski.
Języki i technologie wytwarzania stron WWW Autor: Michał Walkowski Referat.
Architektura Rafał Hryniów. Architektura Wizja projektu systemu, którą dzielą twórcy Struktura komponentów systemu, ich powiązań oraz zasad i reguł określających.
HTML.  Wprowadzenie  Protokół HTTP  Język HTML  Definicja typu dokumentu  Nagłówek strony  Formatowanie treści dokumentu  Definiowanie struktury.
AJAX w PHP.
Wydział Matematyki, Informatyki i Architektury Krajobrazu
Sieci komputerowe Usługi sieciowe 27/09/2002.
Aplikacje i usługi internetowe
Aplikacje i usługi internetowe
Zapis prezentacji:

AJAX Marek Hołówko Maciej Wojciechowski

AJAX – Plan Prezentacji Co oznacza AJAX? Geneza technologii Zasady działania AJAX Technologie używane przez AJAX Zastosowania Wady i zalety

Co oznacza AJAX? 2005 artykuł Jessego Jamesa Garretta pt. „Ajax:A New Approach to Web Applications” AJAX – Asynchronous JavaScript and XML Ogromny wkład Google w rozwój technologii AJAX – Google Labs

Geneza AJAX (1) 1990 r. Tim Berners-Lee i propozycja World Wide Web prosty HTML sposobem na upowszechnienie informacji tekstowej i ilustracyjnej model statyczny brak interaktywnych aplikacji sieciowych

Geneza AJAX (2) 1995 r. Netscape Navigator obsługa ramek Ramka reprezentuje niezależne żądanie wysłane do serwera obsługa JavaScript interakcja pomiędzy użytkownikiem a stroną WWW realizacja prostych zadań w samej przeglądarce (np. sprawdzanie poprawności danych) minimalizacja czasu oczekiwania – istotna w czasach modemów z przesyłem 28,8 kb/s

Geneza AJAX (3) Technika ukrytej ramki ramka o szerokości lub wysokości 0 formularz HTML dynamicznie wypełniany przez JavaScript inicjowanie komunikacji z serwerem po otrzymaniu odpowiedzi wywołanie funkcji JavaScript sygnalizującej oryginalnej ramce otrzymanie danych pierwszy asynchroniczny model w trybie żądanie-odpowiedź

Geneza AJAX (4) 1996 r. – IE 4.0 DHTML (Dynamic HTML) umożliwia zmianę dowolnej części strony już po jej załadowaniu w połączeniu z techniką ukrytej ramki daje możliwość odświeżania strony za pomocą nowych informacji z serwera w każdym czasie DOM (Document Object Model) tworzenie struktury strony WWW CSS (Cascading Style Sheets)

Geneza AJAX (5) 2001 r. XMLHttp wysyłanie asynchronicznych żądań ad hoc z poziomu JavaScript dostęp do kodów statusu HTTP zastąpił technikę ukrytych ramek oraz iframe (dynamicznie tworzonych ramek) XMLHttpRequest – odpowiednik w Mozilli, Operze i Safari

XMLHttp - przykład if (window.XMLHTTP) { var req = new ActiveXOjbect("Microsoft.XMLHTTP"); req.onreadystatechange = requestStateHandler; req.open("GET", "/somefile.xml", true); req.send(null); } function requestStateHandler() { if (req.readyState == 4) { //response ready document.getElementById(‘result’).innerHTML=req.responseText;

Zasady działania AJAX AJAX – technika tworzenia aplikacji internetowych, w której interakcja użytkownika z serwerem odbywa się bez przeładowania całego dokumentu Zastosowanie warstwy pośredniej – silnik AJAX

Zasady działania AJAX Model tradycyjny a model aplikacja AJAX

Zasady działania AJAX

Technologie używane przez AJAX wymagane w Ajaksie HTML/XHTML DOM JavaScript CSS XML XSLT XMLHttp Prezentacja podstawowych treści XHTML – wersja HTML zgodna ze specyfikacją XML Dynamiczna aktualizacja załadowanej strony Format wymiany danych Przekształcenia XML na XHTML Podstawowy broker informacji

XSLT (eXtensible Stylesheet Language Transformations) <?xml version="1.0" ?> <persons> <person username="JS1"> <name>John</name> <family-name>Smith</family-name> </person> <person username="MI1"> <name>Morka</name> <family-name>Ismincius</family-name> </persons> <?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Testing XML Example</title> </head> <body> <h1>Persons</h1> <ul> <li>Ismincius, Morka</li> <li>Smith, John</li> </ul> </body> </html>

Zastosowania Gmail

Zastosowania Google Suggest Google Maps

Zastosowania A9 Yahoo! News

Zalet ciąg dalszy… Nie wymaga pluginów Darmowe narzędzia do tworzenia

Nie taki AJAX piękny… Problemy z przyciskami ‘Wstecz’ i ‘Dalej’ Widoczny kod – hakerzy i plagiaty Problemy z dostosowaniem do różnych przeglądarek Brak dostępu do domen zewnętrznych w stosunku do domeny wywołującej Obsługa może być wyłączona lub niedostępna w niektórych przeglądarkach Trudne debugowanie

Podsumowanie – czym jest AJAX? oparta na standardach prezentacja przy użyciu XHTML oraz CSS dynamiczne wyświetlanie i interakcja z wykorzystaniem Document Object Model wymiana danych i manipulacja nimi przy pomocy XML i XSLT asynchroniczny odczyt danych dzięki XMLHttp JavaScript łącząca wszystko razem w silnik Ajaksowy

Bibliografia Nicholas C. Zakas, Jeremy McPeak, Joe Fawcett „Ajax. Zaawansowane programowanie”, Wyd. Helion, 2007 Christian Gross, „Ajax. Wzorce i najlepsze rozwiązania”, Wyd. Helion, 2007 http://pl.wikipedia.org/wiki/AJAX http://www.adaptivepath.com/ideas/essays/archives/000385.php

Bibliografia http://www.kcjava.org/media/Ajax.pdf http://www.ociweb.com/mark/JavaUserGroup/Ajax.pdf http://faculty.washington.edu/rfish/msis531/lectnote/3up/ajax.pdf