Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska.

Slides:



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

C++ wykład 2 ( ) Klasy i obiekty.
Programowanie obiektowe
Deklaracje i definicje klas w C++ Składowe, pola, metody Konstruktory
Programowanie obiektowe
Wzorce.
Wprowadzenie do języka skryptowego PHP
Wprowadzenie do języka skryptowego PHP – cz. 2
Narzędzia internetowe Paweł Rajba ttp://pawel.ii.uni.wroc.pl/
Kamil Smitkiewicz Bezpieczeństwo w PHP.
Polsko-Japońska Wyższa Szkoła Technik Komputerowych
Technologie XML Mgr inż. Michał Jaros Technologie XML wykład 1.
AJAX Marek Hołówko Maciej Wojciechowski.
PODSTAWY JĘZYKA PHP 1. czym jest 2. składnia 3. wersje 4. bazy danych
Proxy (WWW cache) Sieci Komputerowe
Systemy zarządzania treścią CMS
Projektowanie i programowanie obiektowe II - Wykład IV
PHP wprowadzenie.
Made by Mateusz Szirch Kilka słów o JavaScript.
Aplikacje Internetowe
Wstęp do JavaScriptu Marek Magiera Październik 2003r.
TECHNOLOGIE INTERNETOWE
ANNA BANIEWSKA SYLWIA FILUŚ
Prezentacja i szkolenie
Autor: Kamil Szafranek
Technologie internetowe II
JAVA c.d.. Instrukcji wyboru SWITCH używamy, jeśli chcemy w zależności od wartości pewnego wyrażenia wykonać jeden z kilku fragmentów kodu. Jest to w.
Java – coś na temat Klas Piotr Rosik
Inicjalizacja i sprzątanie
Programowanie obiektowe Wykład 3 dr Dariusz Wardowski, Katedra Analizy Nieliniowej, WMiI UŁ 1/21 Dariusz Wardowski.
Tworzenie Aplikacji Internetowych dr Wojciech M. Gańcza 8.
Tworzenie Aplikacji Internetowych dr Wojciech M. Gańcza 3.
Specjalizacja "Dziennikarstwo On-line„ asynchroniczny JavaScript i XML – AJAX Część 6 Prowadzący: Dariusz Jaruga
PL/SQL – dalsza wędrówka
Projektowanie stron WWW
Aplikacje internetowe
Aplikacje internetowe
W W W Łukasz Stochniał.
J A V A S C R I P T Obiekty Opracowała: Anna Śmigielska.
Projektowanie Aplikacji Internetowych
HTML (ang. HyperText Markup Language ) – język do tworzenia stron internetowych opierający się na znacznikach, czy inaczej je nazywając – tagach. Język.
Kurs języka C++ – wykład 4 ( )
Temat 3: Okno dialogowe.
Zagrożenia.
Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska.
Technologie internetowe Wykład 5 Wprowadzenie do skrytpów serwerowych.
Treści multimedialne - kodowanie, przetwarzanie, prezentacjaOdtwarzanie treści multimedialnych Andrzej Majkowski informatyka +
Piotr Czapiewski Wydział Informatyki ZUT Wykład 2.
Obiekty DOM.
Temat 5: Instrukcje: print(), echo()
Technologie internetowe
PHP. PHP obiektowy, skryptowy język programowania zaprojektowany do generowania stron internetowych w czasie rzeczywistym.
Paweł Starzyk Obiektowe metody projektowania systemów
Waldemar Bartyna 1 Programowanie zaawansowane LINQ to XML.
Programowanie Zaawansowane
Wykład 2 Programowanie obiektowe. Programowanie obiektowe wymaga dobrego zrozumienia działania funkcji definiowanych przez użytkownika, w ten sposób będziemy.
Seminarium Dyplomowe: Metodyka i Techniki Programowania Autor: Bartłomiej Fornal.
Portal edukacyjny J A V A S C R I P T JĘZYK PROGRAMOWANIA STRON HTML Opracowała: Anna Śmigielska.
Języki i technologie wytwarzania stron WWW Autor: Michał Walkowski Referat.
ASP.NET Dostęp do bazy danych z poziomu kodu Elżbieta Mrówka-Matejewska.
HTML.  Wprowadzenie  Protokół HTTP  Język HTML  Definicja typu dokumentu  Nagłówek strony  Formatowanie treści dokumentu  Definiowanie struktury.
Czym jest PHP? ● Językiem programowania przeznaczonym do tworzenia i generowania dynamicznych stron WWW. Działa po stronie serwera: Klient Żądanie strony.
AJAX w PHP.
Programowanie Obiektowe – Wykład 6
Programowanie Obiektowe – Wykład 2
Aplikacje i usługi internetowe
Aplikacje i usługi internetowe
Dane, zmienne, instrukcje
Zapis prezentacji:

Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska

PHP, cz. 3

Klasy

Klasa jest to … Kilka słów wstępu …

Tworzenie obiektów

class student { public $imie; public $nazwisko; function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } $student = new student; $student->imie = "Jan"; $student->nazwisko = "Kowalski"; echo $student->odczytaj_dane(); Tworzenie klasy

class student { private $imie; private $nazwisko; function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } $student = new student; $student->imie = "Jan"; $student->nazwisko = "Kowalski"; echo $student->odczytaj_dane(); Zasięg zmiennych i metod

public – zmienna lub metoda jest widoczna z poziomu całego skryptu PHP protected – zmienna lub metoda jest widoczna tylko z obiektu w którym się znajduje bądź z jego obiektu podrzędnego i tylko z tego poziomu może być dostępna lub widoczna private – zmienna lub metoda jest widoczna tylko z obiektu w którym się znajduje Zasięg zmiennych i metod

public – zmienna lub metoda jest widoczna z poziomu całego skryptu PHP protected – zmienna lub metoda jest widoczna tylko z obiektu w którym się znajduje bądź z jego obiektu podrzędnego i tylko z tego poziomu może być dostępna lub widoczna private – zmienna lub metoda jest widoczna tylko z obiektu w którym się znajduje Zasięg zmiennych i metod

class klasa_pierwsza { public $public = "dostęp public"; protected $protected = "dostęp protected"; private $private = "dostęp private"; function pokaz_zmienne() { echo $this->public."\n"; echo $this->protected."\n"; echo $this->private."\n"; } $obiekt_1 = new klasa_pierwsza; $obiekt_1->pokaz_zmienne(); //wyświetlone zostaną wszystkie zmienne echo $obiekt_1->public; //ok echo $obiekt_1->protected;//błąd!! echo $obiekt_1->private; //błąd!! Zasięg zmiennych i metod

class klasa_druga extends klasa_pierwsza {} $obiekt_2 = new klasa_druga; $obiekt_2->pokaz_zmienne(); // pokazane zostaną: $public, $protected i $private echo $obiekt_2->public; //ok echo $obiekt_2->private; //zmienna niezdefiniowana echo $obiekt_2->protected; //błąd!! Zasięg zmiennych i metod

class student { private $imie; private $nazwisko; function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } function ustaw_dane($imie="", $nazwisko=""){ $this->imie = $imie; $this->nazwisko = $nazwisko; } $student = new student; $student->ustaw_dane("Anna", "Kowalska"); echo $student->odczytaj_dane(); Konstruktor [1]

<?php class student { private $imie; private $nazwisko; function __construct($imie="", $nazwisko="") { $this->imie = $imie; $this->nazwisko = $nazwisko; } function __destruct(){echo "bye bye student";} function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } function ustaw_dane($imie="", $nazwisko=""){ $this->imie = $imie; $this->nazwisko = $nazwisko; } ?> Konstruktor i destruktor [2]

<? $student = new student("Jan", "Nowak"); echo $student->odczytaj_dane(). "\n"; $student->ustaw_dane("Anna", "Kowalska"); echo $student->odczytaj_dane(). "\n"; ?> tu jest kod do wykonania... Konstruktor i destruktor [3]

<?php class czlowiek { private $wzrost; private $waga; private function ustaw_wzrost($wzrost) {$this->wzrost=$wzrost;} private function ustaw_wage($waga) {$this->waga=$waga;} public function ustaw_wzrost_i_wage($wzrost, $waga) {$this->ustaw_wzrost($wzrost); $this->ustaw_wage($waga);} public function odczytaj_wiw() {return $this->wzrost. ", ". $this->waga;} }//class Klasy potomne [1]

class student extends czlowiek { private $imie; private $nazwisko; function __construct($imie="", $nazwisko="") { $this->imie = $imie; $this->nazwisko = $nazwisko; } function odczytaj_dane(){return $this->imie. ", ". $this- >nazwisko;} function ustaw_dane($imie="", $nazwisko="") {$this->imie = $imie;$this->nazwisko = $nazwisko;} function odczytaj_wszystko() {return $this->odczytaj_wiw();} } ?> <? $student = new student("Jan", "Nowak"); $student->ustaw_wzrost_i_wage(180,90); echo $student->odczytaj_wszystko(); ?> Klasy potomne [2]

Referencje i klonowanie = clone

<?php class student { private $imie; private $nazwisko; function __construct($imie="", $nazwisko="") { $this->imie = $imie; $this->nazwisko = $nazwisko; } function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } function ustaw_dane($imie="", $nazwisko=""){ $this->imie = $imie; $this->nazwisko = $nazwisko; } ?> Referencje i klonowanie

<? $s = new student("Jan","Kowalski"); echo $s->odczytaj_dane(); echo "\n"; $d = $s; $s->ustaw_dane("Anna", "Kowalska"); echo $d->odczytaj_dane(); echo "\n"; $e = clone($d); $d->ustaw_dane("Michał", "Nowak"); echo $e->odczytaj_dane(); ?> Referencje i klonowanie

Interfejs interfejs jest definicją abstrakcyjnego typu posiadającego jedynie operacje, a nie dane.

interface student_budowa { function odczytaj_dane(); function ustaw_dane($imie, $nazwisko); } class student implements student_budowa { private $imie; private $nazwisko; function __construct($imie="", $nazwisko="") { $this->imie = $imie; $this->nazwisko = $nazwisko; } function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } function ustaw_dane($imie="", $nazwisko=""){ $this->imie = $imie; $this->nazwisko = $nazwisko; } Interfejsy

interface student_budowa { function odczytaj_dane(); function ustaw_daneX($imie, $nazwisko); } Interfejsy

Klasa abstrakcyjna

interface student_budowa { function odczytaj_dane(); function ustaw_dane($imie, $nazwisko); } abstract class student_baza { private $nazwisko; abstract function pobierz_imie(); function witaj() { return "cześć!"; } Klasa abstrakcyjna [1]

class student extends student_baza implements student_budowa { private $imie; private $nazwisko; function __construct($imie="", $nazwisko="") { $this->imie = $imie; $this->nazwisko = $nazwisko; } function pobierz_imie(){ return $this->imie; } function odczytaj_dane(){ return $this->imie. ", ". $this->nazwisko; } function ustaw_dane($imie="", $nazwisko=""){ $this->imie = $imie; $this->nazwisko = $nazwisko; } Klasa abstrakcyjna [2]

<? $s = new student("Jan","Kowalski"); echo $s->witaj(); echo $s->pobierz_imie(); ?> Klasa abstrakcyjna [3]

abstract class student_baza { private $nazwisko; abstract function pobierz_imie(); abstract function pobierz_nazwisko(); function witaj() { return "cześć!"; } Klasa abstrakcyjna [4]

Zmienne i metody statyczne odwołanie do funkcji i zmiennych klasy nie poprzez obiekt elementy statyczne definiowane są operatorem static dostęp publiczny zamiast $this-> używamy self:: parent::

class mysqlp { //klasa połączeniowa public static $login, $haslo, $bd, $IP; public static $link; function dane($login="",$haslo="", $bd="", $IP="localhost"){ self::$login=$login; self::$haslo=$haslo; self::$bd=$bd; self::$IP=$IP; } function polacz(){ self::$link = mysqli_connect(self::$IP, self::$login, self::$haslo, self::$bd); echo "połączono..\n"; } } //class operator dwukropka [1] ::

class mysqlz extends mysqlp {//klasa do zapytań public static $wynik; function zapytanie($q=""){self::$wynik = mysqli_query(self::$link, $q);} function pokaz_wynik(){ while ($tabl = mysqli_fetch_assoc(self::$wynik)){ foreach($tabl as $k=>$v) { echo "$k => $v \n"; } }//while }//function public function polacz(){ if (mysqli_real_connect(self::$link, self::$IP,self::$login, self::$haslo, self::$bd)) { echo "połączenie z bazą danych jest aktywne..."; }; } public function polacz_ponownie(){ parent::polacz(); } }//class operator dwukropka [2] ::

<? mysqlp::dane("aniewiarowski", "xx", "aniewiarowski_baza"); echo mysqlp::polacz(); echo " "; mysqlz::dane("aniewiarowski", "xx", "aniewiarowski_baza"); //echo mysqlz::polacz(); mysqlz::zapytanie("select * from uzytkownicy limit 5;"); mysqlz::pokaz_wynik(); mysqlz::polacz(); mysqlz::polacz_ponownie(); ?> operator dwukropka [3] ::

Trochę JavaScript'u … AJAX

Kilka słów o języku JavaScript 1.język skryptowy 2.działa po stronie przeglądarki 3.powstał w 1995 roku wraz z przeglądarką Netscape początkowe nazwy: Mocha, LiveScript 5.po umowie w firmą Sun – JavaScript 6.w Internet Explorer od wersji 3.0 (rok 1996) – Jscript (z przyczyn prawnych) 7.ECMAScript – rok 1997 – standard definiuje kluczowe elementy języka 8.ECMAScript w 1998 został uznany za normę ISO

Umieszczanie kodu w ciele strony

Dynamiczne umieszczanie plików zewnętrznych

Umieszczanie w pseudoadresach URL

Wykonanie kodu za pomocą obsługi zdarzeń na obiektach.

Wywołanie kodu JavaScript wraz z odnośnikiem.

document.write("Obsługa JavaScript: TAK"); Obsługa JavaScript: NIE Obsługa przeglądarki, w której jest wyłączona obsługa języka JavaScript lub przeglądarka go nie obsługuje.

Detekcja przeglądarki

Wykorzystanie navigator.appName

Wykorzystanie navigator.userAgent

Sprawdzanie obsługi funkcji wymaganych przez stronę internetową.

Zapobieganie buforowaniu obrazków za pomocą JavaScript.

Zapobieganie buforowaniu dokumentów za pomocą JavaScript.

Przekierowanie i odświeżanie strony internetowej

Przekierowanie strony internetowej.

Przekierowanie strony internetowej za pomocą HTMLa.

Opóźnienie przekierowania strony internetowej.

Podmiana strony internetowej. Poprzednia strona nie zapisuje się w historii przeglądanych stron.

Odświeżenie strony internetowej.

Zapobieganie buforowaniu.

Odczytywanie daty i czasu

Wykorzystanie obiektu Date.

Wybrane metody obiektu Date. metodaopis getDate()aktualny dzień miesiąca getFullYear()aktualny rok w pełnym formacie getHours()aktualna godzina getMinutes()aktualne minuty getSeconds()aktualne sekundy getMonth()+1aktualny miesiąc toString()konwersja do ciągu

Wyświetlenie daty modyfikacji strony.

Nawigacja w historii przeglądarki.

Okna z komunikatami

Okno alert.

Okno confirm.

Okno prompt.

AJAX

Termin wymyślony w 2005 roku przez Jesse James Garret, oznacza z j. ang. Asynchronous JavaScript and XML, czyli asynchroniczny JavaScript i XML. Jest to technologia tworzenia stron internetowych, w której interakcja użytkownika z serwerem odbywa się bez przeładowania całej strony internetowej, a dane pobierane są dynamicznie i umieszczane w konkretne miejsca w dokumencie internetowym.

AJAX Na technologię AJAX składają się następujące elementy: 1.XMLHttpRequest – klasa umożliwiająca przesyłanie danych. W trakcie przesyłu danych użytkownik może wykonywać inne czynności na stronie. Dane mogą być pobierane z różnych plików umiejscowionych serwerze tej samej domeny w jednej chwili. 2.JavaScript – język skryptowy. W rzeczywistości może być to dowolny język skryptowy działający po stronie przeglądarki internetowej (np. VBScript). 3.XML – z j. ang. Extensible Markup Language, czyli Rozszerzalny Język Znaczników – uniwersalny język formalny, dzięki któremu istnieje możliwość reprezentowania różnych danych w strukturalizowany sposób. W praktyce, w tej technologii przesyłane są fragmenty stron internetowych napisane w HTMLu.

AJAX Wady technologii: 1.Strony funkcjonują w oparciu o język skryptowy. To sprawia, że strony są dostępne wyłącznie dla użytkowników, u których nie jest zablokowana obsługa języków skryptowych w przeglądarkach internetowych. 2.Utrudnienia podczas pobierania strony internetowych na dysk. Fragmenty stron, które wypełnione są danymi z użyciem technologii AJAX, nie będą zapisane w pliku. 3.Problem z indeksowaniem stron przez roboty wyszukiwarek internetowych. 4.Jeżeli przeglądanie podstron danej witryny internetowej oparte jest wyłącznie o AJAX, to w tym momencie przestaje funkcjonować standardowy model przeglądania strony internetowej, co może skutkować niechęcią pewnej części użytkowników.

AJAX Reasumując: w technologii AJAX chodzi wyłącznie o zastosowanie XMLHttpRequest do wysyłania żądań HTTP do serwera WWW i użycie języka JavaScript (lub innego skryptowego) do wykonania odpowiednich działań i wyświetlenia danych po stronie użytkownika.

Inicjowanie aplikacji AJAX XMLHttp = new XMLHttpRequest(); XMLHttp = new ActiveXObject("Microsoft.XMLHTTP"); Obiekt XMLHttpRequest jest podstawą technologii AJAX. Jest on obsługiwany przez wszystkie przeglądarki obsługujące AJAX, natomiast w przypadku niektórych wersji Internet Explorer, wymagany jest obiekt ActiveX.

Tworzenie nowego obiektu XMLHttpRequest AJAX

Przykład utworzenia nowego obiektu XMLHttpRequest. plik: xmlhttp.js

Wysyłanie żądania GET AJAX

Wysyłanie żądania GET

var XMLHttp = getXMLHttp(); XMLHttp.open("GET", "plik.php"); XMLHttp.onreadystatechange = handlerFunction; XMLHttp.send(null); function handlerFunction() { if (XMLHttp.readyState == 4) { window.alert("Wczytane dane: " + XMLHttp.responseText); } Wysyłanie żądania GET

Stany obiektu XMLHttpRequest 0 – nie zainicjowano 1 – wczytywanie 2 – wczytanie 3 – oczekiwanie 4 – zakończenie

AJAX Wysyłanie żądania POST

XMLHttp.setRequestHeader("Content-type", "application/x-www-form- urlencoded"); XMLHttp.send("zmienna1=Technologia&zmienna2=AJAX"); W przeciwieństwie do metody GET, metoda POST nie wysyła parametrów w adresie, lecz w parametrach metody send().

Wysyłanie żądania POST

AJAX Żądania synchroniczne

XMLHttp.open("GET", "plik.php", false); Trzeci parametry metody open przyjmuje wartość false. Bez podania parametru trzeciego, domyślnie jest true – czyli żądanie asynchroniczne. Wywołanie synchroniczne zatrzymuje całkowicie wykonywanie skryptu. Jeżeli łącze jest wolne lub serwer jest przeciążony strona będzie się zacinać.

wczytywanie danych... window.onload = function() { var XMLHttp = getXMLHttp(); XMLHttp.open("GET", "plik.php", false); XMLHttp.send(null); document.getElementById("tresc").innerHTML = XMLHttp.responseText; } Żądania synchroniczne

AJAX Przerwanie żądania HTTP

XMLHttp.abort(); Sens przerwania pobierania danych ma miejsce wtedy, gdy wartość parametru readyState jest różna od 4 i od 0. W przeciwnym wypadku nie ma czego przerywać.

var XMLHttp = getXMLHttp(); XMLHttp.open("GET", "czekaj.php?" + Math.random()); XMLHttp.onreadystatechange = handlerFunction; XMLHttp.send(null); window.setTimeout("timeout();", 5000); function handlerFunction() { if (XMLHttp.readyState == 4) { window.alert("Wczytane dane: " + XMLHttp.responseText); } function timeout() { if (XMLHttp.readyState != 4 && XMLHttp.readyState != 0) { XMLHttp.onreadystatechange = function() { }; XMLHttp.abort(); window.alert("Anulowano pobieranie danych"); } Przerwanie żądania HTTP

AJAX Pobranie nagłówków HTTP

Pobranie nagłówka HTTP var XMLHttp = getXMLHttp(); XMLHttp.open("GET", "plik.php"); XMLHttp.onreadystatechange = handlerFunction; XMLHttp.send(null); function handlerFunction() { if (XMLHttp.readyState == 4) { var servertype = XMLHttp.getResponseHeader("Server"); window.alert("Serwer WWW: " + servertype); }

Pobranie nagłówków HTTP var XMLHttp = getXMLHttp(); XMLHttp.open("GET", "plik.php", false); XMLHttp.onreadystatechange = handlerFunction; XMLHttp.send(null); function handlerFunction() { if (XMLHttp.readyState == 4) { var serverinfo = XMLHttp.getAllResponseHeaders(); document.write(serverinfo); }

AJAX Sprawdzenie istnienia pliku na serwerze – zmienna status.

XMLHttp.status wczytywanie danych... window.onload = function() { var XMLHttp = getXMLHttp(); XMLHttp.open("GET", "xplik.php", false); XMLHttp.send(null); tresc = XMLHttp.responseText; if (XMLHttp.status == 404) { tresc = " brak pliku! "; } document.getElementById("tresc").innerHTML = tresc; }

AJAX Wybrane kody odpowiedzi HTTP

Wybrane kody odpowiedzi HTTP. Kody informacyjne 110 – Connection Timed Out. Przekroczono czas połączenia. Serwer zbyt długo nie odpowiada. 111 – Connection refused. Serwer odrzucił połączenie Kody powodzenia 200 – OK. Zawartość żądanego dokumentu (najczęściej zwracany nagłówek odpowiedzi w komunikacji WWW Internetu)

Wybrane kody odpowiedzi HTTP. Kody przekierowania 400 – Bad Request. Nieprawidłowe zapytanie – żądanie nie może być obsłużone przez serwer z powodu błędnej składni zapytania 403 – Forbidden. Zabroniony – serwer zrozumiał zapytanie lecz konfiguracja bezpieczeństwa zabrania mu zwrócić żądany zasób 404 – Not Found. Nie znaleziono – serwer nie odnalazł zasobu według podanego URL ani niczego co by wskazywało na istnienie takiego zasobu w przeszłości 414 – Request-URI Too Long. Adres URI zapytania zbyt długi – długość zażądanego URI jest większa niż maksymalna oczekiwana przez serwer 500 – Internal Server Error. Wewnętrzny błąd serwera – serwer napotkał niespodziewane trudności, które uniemożliwiły zrealizowanie żądania

C. D. N.