TIN Techniki Internetowe zima

Transkrypt

1 TIN Techniki Internetowe zima Grzegorz Blinowski Instytut Informatyki Politechniki Warszawskiej

2 Plan wykładów 2 Intersieć, ISO/OSI, protokoły sieciowe, IP 3 Protokoły transportowe: UDP, TCP 4 Model klient-serwer, techniki progr. serwisów 5 Protokoły aplikacyjne: telnet, ftp, smtp, nntp, inne 6, HTTP 7, 8 HTML, XML 9, 10, 11 Aplikacje WWW, CGI, sesje, serwery aplikacji serwlety, integracja z backended SQL 12 Aspekty zaawansowane: wydajność, przenośność, skalowalność; klastering 13 SOAP

3 Aplikacje WWW

4 Wymagania Otwartość (w sensie obsługi standardów) Skalowalność, wydajność Stabilność Bezpieczeństwo Integralność transakcji (Ochrona inwestycji )

5 Aplikacje WWW Aplikacje Web - nowe ucieleśnienie modelu klient- serwer: przeglądarka - klient Serwer: serwer WWW, serwer aplikacji, serwer bazy danych (źródła danych), monitor transakcji Dlaczego aplikacje Web? Dostępna, powszechna, standardowa technologia Standardy otwarte - pozwalają na wdrożenie intranetu i ekstranetu - nie możemy zakładać, że klienci (partnerzy) będą się dostosowywać do naszych rozwiązań B. duża oferta serwerów, narzędzi, itp. Niski koszt utrzymania klienta - klientem jest przeglądarka lub applet Java, w przypadku awarii lub złego funkcjonowania reinstalacja jest b. prosta - przeglądarka - prosta w obsłudze i administracji, tania, wymienna

6 Thin/fat client Klient - interfejs GUI i "logika biznesowa" "Fat Client" GUI + aplikacja Źródło danych Klient - tylko GUI i prosta weryfikacja danych "Thin Client" Serwer aplikacji Źródło danych Serwer aplikacji - logika biznesowa

7 Warstwy aplikacji WWW Klient: prezentacja, elementarna logika (JavaScript - np. weryfikacja danych wejściowych, obsługa słowników) Serwer WWW strony statyczne (prosty serwer aplikacji) Serwer Aplikacji warstwa prezentacji warstwa sesji warstwa logiki (aplikacji) warstwa komunikacji z: backend, innymi S.A., innymi serwerami Źródła danych bazy relacyjne inne bazy danych (n.p. full-text, )

8 Formularze Podstawowe mechanizmy klienckie Podstawowe kontrolki interaktywne: pola tekstowe, przyciski, listy wyboru, checkbox, radio,... Dość ubogie w stosunku do kontrolek typowego GUI JavaScript (ECMA Script) Applety Java "Komponenty" (inne applety): ActivX, COM,

9 Formularze HTML Formularz zawarty między tagami: <form> </form> atrybuty formularza: <form method="get POST" action="/path/program" enctype="application/x-www-form-urlencoded multi-part/formdata"> brak akcji - zgłoszenie do aktualnego URL Elementy formularza: statyczne zmienne ukryte - hidden kontrolki "input" pola tekstowe zwykłe (text) i z ukrytym tekstem (password) radio, checkbox przyciski specjalne: submit i reset (przywróć) Pola tekstowe (textarea) listy wyboru - jednokrotne (select), wielokrotne(select multiple)

10 HIDDEN <input type="hidden" name="nazwa" Value="Wartosc"> Tworzy element formularza, który nie jest w żaden sposób wyświetlany w przeglądarce Elementy hidden wykorzystywane są do przenoszenia danych między formularzami Przykładowo: aktualnego języka identyfikatora użytkownika danych sesji, itp.

11 INPUT TEXT, PASSWORD <input type="text" name="nazwa" Value="tekst poczatkowy" size="nnn" maxsize="mmm" > <input type="password" name="nazwa" Value="tekst poczatkowy" size="nnn" maxsize="mmm" > Tworzy jednolinijkowe pole tekstowe Jest to domyślny typ elementu input Value określa tekst domyślny zawarty w polu Size określa rozmiar widocznego pola, a maxsize maksymalną długość przyjmowanego tekstu Dla password echo tekstu ma postać "*" Uwaga - password w żaden sposób nie zabezpiecza danych przed podsłuchem!

12 INPUT CHECKBOX <input type="checkbox" name="nazwa" Value="wartosc" [checked]> Tworzy binarny przełącznik Z formularza zwracane są tylko te przełączniki, które zostały zaznaczone Zwracana jest watość podana w value Można utworzyć wiele przełączników o tej samej nazwie, wartości zaznaczone zostaną wtedy zgrupowane

13 INPUT RADIO <input type="radio" name="nazwa" Value="wartosc" [checked]> Tworzy przełącznik typu "1-z-wielu" Grupa przełaczników radio identyfikowana jest wspólną nazwą W obrębie grupy tylko jeden przełącznik może być zaznaczony Zwracana jest watość podana w value (jedna)

14 INPUT BUTTON <input type="button" name="nazwa" Value="Opis"> Tworzy przycisk o nazwie name z opisem value Przycisk nie przekazuje informacji jako rezultat działania formularza, może być jednak użyty poprzez zdarzenia JavaScript

15 INPUT SUBMIT <input type="submit" Value="wartosc"> <input type="reset" Value="wartosc"> Submit: Tworzy przycisk zgłaszający formularz Domyślny przekazywany tekst to "Submit" Reset: Naciśnięcie powoduje powrót wszystkich wartości formularza do domyślnych

16 INPUT FILE <input type="file" name="nazwa" value="nazwapliku" accept="lista typów MIME"> Tworzy dialog wyboru pliku otwierany przyciskiem "browse" Plik zostanie wczytany i przesłany do serwera dopiero w momencie zgloszenia formularza value określa prefiks dla nazwy pliku accept zawiera listę typów MIME, która zostanie przesłana do serwera encoding przybierze wartość multi-part/form-data (domyślny typ to application/form-www-urlencoded)

17 TEXTAREA <textarea name="nazwa" cols="nn" rows="rr" wrap="off virtual physical soft hard"> tekst domyslny </textarea> Tworzy pole tekstowe składające się z wielu linii cols, rows: określa rozmiary pola wrap: określa sposób łamania tekstu: off - użytkownik musi sam wcisną "Enter" virtual (soft) - automatycznie wstawione znaki końca wiersza nie będą przesłane do serwera physical (hard)- automatycznie wstawione znaki końca wiersza będą przesłane do serwera

18 SELECT <select name="nazwa" size="nnn" multiple> <option value="wartosc" label="lab" selected>tekst</option>. </select> Tworzy listę wyboru multiple - Lista umożliwia wybór wielu elementów na raz size określa sposób prezentacji i rozmiar: 0 - lista rozwijalna w dół >=1 - lista opcji, przewijana gdy liczba pozycji > size Option zwraca tekst objęty tagami lub value (jeśli obecne) selected - domyślnie wybrany

19 GET i POST GET dane przekazane w formularzu przekazywane są bezpośrednio w żądaniu - tj. w URL stosowane jest URL encoding (spacje, inne znaki nielegalne w URL) zastosowanie - proste formularze POST dane przekazane w formularzu przekazywane są w request entity zastosowanie - tam gdzie wymagane przekazanie większej porcji danych

20 GET i POST GET b. proste do przetworzenia po stronie serwera zgłoszone dane widoczne jako URL w przeglądarce (wada?, zaleta?) rezultat zgłoszenia może być dodany jako zakładka Nie można zgłaszać plików (html-file-upload) wielkość danych ograniczona do kilkuset bajtów - kilku KB POST nieco trudniejsze do przetworzenia po stronie serwera zgłoszone dane nie są widoczne rezultat zgłoszenia nie może być dodany jako zakładka można zgłaszać pliki (htmlfile-upload) - kodowanie MIME wielkość danych nieograniczona