docProgrammazione Web Programma
download 
Reclamo Transcript
Programmazione Web Programma
2014-‐2015 Programmazione Web Prof. Pierpaolo Lore: 2014-‐2015 Programmazione WEB Programma • • • • • • • Archite?ure Client-‐Server e HTTP HTML e HTML5 Fogli di s:le CSS Basi di programmazione Javascript Basi di programmazione PHP Database per il web Altro – AJAX , JSON ed interfacce REST 2014-‐2015 Programmazione WEB Programmazione WEB 1 2014-‐2015 Obie/vi • Fornire allo studente le nozioni di base delle principali delle tecnologie e delle archite?ure di comunicazione usate nel WEB 2014-‐2015 Programmazione WEB Modalità d'esame • Due prove – Prova scri?a – Prova pra:ca • Altri pun: – Proge?o – Esercizi 2014-‐2015 Programmazione WEB Programmazione WEB 2 2014-‐2015 Ambiente di Lavoro • Vi verrà fornito un account per poter fare le esercitazioni su un server • Il server è una macchina Linux con – Server Web Apache2 – Supporto PHP – Database MySQL • Si accederà mediante ssh – Filezilla • Editor di testo • Browser 2014-‐2015 Programmazione WEB Supporto • h?p://ppl.eln.uniroma2.it/pw/ • [email protected] 2014-‐2015 Programmazione WEB Programmazione WEB 3 2014-‐2015 Tes> di riferimento • Learning Web Design -‐ A Beginner’s Guide to HTML, CSS, JavaScript, and Web Graphics – Fourth Edi>on – Jennifer Niederst Robbins – h?p://www.learningwebdesign.com/ 2014-‐2015 Programmazione WEB INTERNET ED IL WEB 2014-‐2015 Programmazione WEB Programmazione WEB 4 2014-‐2015 Internet • Internet è una rete di computer – tan: computer che posso parlare fra loro • Internet è un sistema coopera:vo governato da standard e regole • Lo scopo di far comunicare i computer è quello di condividere informazioni • Le modalità di scambio delle informazioni sono tante: – email, trasferimento file, etc. • Le regole che perme?ono lo scambio di informazioni fra computer sono de?e "protocolli" 2014-‐2015 Programmazione WEB Web • Il Web è uno dei modi con cui le informazioni possono essere condivise • La peculiarità del web è quella di poter "collegare" i documen: fra loro – usando i link dell'ipertesto • L'insieme di tue i documen: collega: forma il “web” di informazioni connesse. • Il web usa un protocollo per scambiare documen: chiamato HTTP (HyperText Transfer Protocol). – lo scrivete spesso quando navigate 2014-‐2015 Programmazione WEB Programmazione WEB 5 2014-‐2015 Breve storia • Il web nasce nel 1989 a Ginevra, in Svizzera nei laboratori del CERN • Tim Berners-‐Lee fu il primo a proporre un sistema di ges:one delle informazioni basato sull'ipertesto per collegare i documen: fra loro – Lui e Robert Cailliau hanno creato un proto:po • 1992 – i server web erano 50. – nasce NCSA Mosaic, il primo Browser grafico e il Web iniziò ad essere "di massa" • Per approfondire: – W3C’s History Archives – www.w3.org/History.html 2014-‐2015 Programmazione WEB Breve storia • Il web nasce nel 1989 a Ginevra, in Svizzera nei laboratori del CERN • Tim Berners-‐Lee fu il primo a proporre un sistema di ges:one delle informazioni basato sull'ipertesto per collegare i documen: fra loro – Lui e Robert Cailliau hanno creato un proto:po • 1992 – i server web erano 50. – nasce NCSA Mosaic, il primo Browser grafico e il Web iniziò ad essere "di massa" • Per approfondire: – W3C’s History Archives – www.w3.org/History.html 2014-‐2015 Programmazione WEB Programmazione WEB 6 2014-‐2015 STORIA: HTML • Nelle prime pagine web, s:le e stru?ura erano mischia: • Esempio: <font size="3" color="red">Testo di prova</font> • Deprecato! • Successivamente si sono volute separare le par:: • HTML: stru?ura e contenuto • CSS: s:le e forma?azione • Perchè? • Codice più facile e mantenibile • Più facilità di ada?amento a diversi disposi:vi • Miglioramento “seman:co” 2014-‐2015 Programmazione WEB Storia HTML e CSS • Versioni dell'HTML HTML 1991 HTML+ 1993 HTML 2.0 1995 HTML 3.2 1997 HTML 4.01 1999 XHTML 2000 HTML5 2012 • Versioni CSS CSS1 1996 CSS2 2004 CSS2.1 2011 CSS3 2014-‐2015 Programmazione WEB 2014 Programmazione WEB 7 2014-‐2015 Server Web • I computer che fanno parte del web si chiamano server perché offrono un servizio: rispondono a delle richieste di documen> • In realtà chi offre il servizio è un programma: il server web – Aspe?a una richiesta, cerca un documento e lo invia al richiedente • Il server web deve ges:re il protocollo HTTP (Hypertext Transfer Protocol ) – spesso lo chiamiamo Server HTTP • I computer server non sono par:colari – ogni computer può diventare un server • Server famosi – Apache (53%) – nginx (17%) – Microsoy Internet Informa:on Services (12%) 2014-‐2015 Programmazione WEB Indirizzi dei server • Come faccio ad arrivare al server web? • Ad ogni computer in internet è assegnato un numero unico: l'indirizzo IP – non solo computer anche modem, router, smarthphone, macchine, radio ... • IP sta per Internet Protocol • Il computer che ospita web.uniroma2.it ha come ip 160.80.1.246 2014-‐2015 Programmazione WEB Programmazione WEB 8 2014-‐2015 Indirizzi binari • 192.168.0.1 -‐> 11000000 10101000 00000000 00000001 octet1 octet2 octet3 octet4 -‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐ 192 168 0 1 128 64 32 16 8 4 2 1 -‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐ 1 1 0 0 0 0 0 0 -‐-‐ Bits • 128+64=192 2014-‐2015 Programmazione WEB Sono fini> gli IP • La IANA è l'oragnanizzazione che assegna gli indirizzi IP • Il 3 febbraio 2011 ha assegnato l'ul:mo blocco di indirizzi IP del :po ##.##.##.## – sono dee IPv4 (32 bit) – perme?ono 4.3 billion di indirizzi unici addresses – nel 1977 si pensava bastassero • Hanno creato un nuovo formato di indirizzi de?o IPv6 – Indirizzo IPv6: 2001:0db8:85a3:0000:1319:8a2e:0370:7344 – è un formato che perme?e :lioni di indirizzi unici (128 bit) • IPv4 e IPv6 non possono lavorare insieme – IPv6 è una sorta di internet parallelo 2014-‐2015 Programmazione WEB Programmazione WEB 9 2014-‐2015 Pubblicità ... 2014-‐2015 Programmazione WEB Numeri o Nomi? • • • • • 173.252.110.27 è www.facebook.com 173.194.34.87 è www.google.it 213.92.16.171 è www.repubblica.it 94.32.108.10 è www.ilmeteo.it 107.23.159.223 è www.instagram.com • Indirizzi nuovi: – 2a00:1450:4002:804::1012 è www.google.com 2014-‐2015 Programmazione WEB Programmazione WEB 10 2014-‐2015 Domain Name Server • All'uomo è comodo dare un nome ai server • Ai computer serve un indirizzo numerico per comunicare con le altre macchine • Esistono dei computer che traducono nomi in indirizzi IP www.google.it 173.194.34.87 nslookup www.google.com 2014-‐2015 DNS Server Programmazione WEB Whois? • Di chi sono i nomi? • Registro dei nomi – h?p://www.nic.it/web-‐whois/index.jsf 2014-‐2015 Programmazione WEB Programmazione WEB 11 2014-‐2015 I Client • I soyware che fanno richieste ai server si chiamano client – sono clien: dei server – I più comuni client web sono i Browser • Richiesta di un documento – Il browser chiede un documento al server – Il server glielo spedisce – Il browser lo mostra all'utente GET page1.html 2014-‐2015 Programmazione WEB I Browser • Sia le richieste che le risposte sono ges:te mediante HTTP. • I documen: possono essere qualsiasi file: testo, immagini, video, audio, script, etc. • Browser famosi – Explorer, Firefox, Chrome, Safari, Opera • I browser mostrano dei documen: richies: al server in un finestra – spesso gli stessi documen: sono mostra: in modo diverso dai diversi browse 2014-‐2015 Programmazione WEB Programmazione WEB 12 2014-‐2015 Web Page Addresses (URLs) Web Page Addresses (URLs) Every page and resource on the Web has its own special address called a URL, which stands for Uniform Resource Locator. It’s nearly impossible to get through a day without seeing a URL (pronounced “U-R-L,” not “erl”) plastered on the side of a bus, printed on a business card, or broadcast on a television commercial. Web addresses are fully integrated into modern vernacular. Indirizzi delle pagine web: URL Hey, There’s No http:// on That URL! Some URLs are short and sweet. Others may look like crazy strings of characters separated by dots (periods) and slashes, but each part has a specific purpose. Let’s pick one apart. • Ogni pagina web e ogni risorsa ha un indirizzo • Questo si parts chiama URL (Uniform Resource Locator) The of a URL Because nearly all web pages use the Hypertext Transfer Protocol, the http:// part is often just implied. This is the case when site names are advertised in print or on TV, as a way to keep the URL easy to remember. Additionally, browsers are programmed to add http:// automatically as a convenience to save you some keystrokes. It may seem like you’re leaving it out, but it is being sent to the server behind the scenes. When we begin using URLs to create hyperlinks in HTML documents in Chapter 6, Adding Links, you’ll learn that it is necessary to include the protocol when making a link to a web page on another server. A complete URLgisiorno: generally made up of three components: the protocol, – li vedete ogni the site name, and the absolute path to the document or resource, as shown • hRp://www.google.it in Figure 2-1. 1 Protocol 2 Name of site 3 Absolute path http:// www.example .com /2011/samples/first.html Host name Domain name Directory path Document 2-1. The parts of ad URL. • le URL Figure sono fa?e i tre par: http:// – Il protocollo The first thing the URL does is define the protocol that will be used for – Il nome el server thatdparticular transaction. The letters HTTP let the server know to use Hypertext Transfer Protocol, or get into “web mode.” – Il path della risorsa www.example.com 2014-‐2015 N OT E Sometimes you’ll see a URL that begins with https://. This is an indication that it is a secure server transaction. Secure servers have special encryption devices that hide delicate content, such as credit card numbers, while they are transferred to and from the browser. Look for it the next time you’re shopping online. The next portion of the URL identifies the website by its domain name. In this example, the domain name is example.com. The “www.” part at Programmazione WEB the beginning is the particular host name at that domain. The host name “www” has become a convention, but is not a rule. In fact, sometimes the host name may be omitted. There can be more than one website at a domain (sometimes called subdomains). For example, there might also be development.example.com, clients.example.com, and so on. /2012/samples/first.html This is the absolute path through directories on the server to the requested HTML document, first.html. The words separated by slashes are the directory names, starting with the root directory of the host (as indicated by the initial /). Because the Internet originally comprised computers running the Unix operating system, our current way of doing things still File di Default • alcune URL non includono il nome del file 24 Part I, Getting Started – indicano solo una directory – www.uniroma2.it/ www.it-ebooks.info – ppl.eln.uniroma2.it/pw/ • Se una richiesta non presenta esplicitamente il file il server web cerca il file index.html – www.uniroma2.it/index.html – ppl.eln.uniroma2.it/pw/index.html • Il nome del file di default può essere configurato e può variare da server a server – – – – – index.html index.htm default.html index.php index.asp 2014-‐2015 Programmazione WEB Programmazione WEB 13
