introdução à arquitectura de aplicações para a web
TRANSCRIPT
![Page 1: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/1.jpg)
Introdução à Arquitectura de aplicações para a Web
![Page 2: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/2.jpg)
Introdução à Arquitectura de aplicações para a Web
Arquitectura Cliente, Servidor Protocolo de comunicação HTTP Noção de URL Evolução histórica Desenvolvimentos actuais
![Page 3: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/3.jpg)
Arquitectura Cliente Servidor
Cliente Servidor“xpto”
http://www.xpto.pt/abcd.htm
![Page 4: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/4.jpg)
Protocolo HTTP
HTTP – Hypertext Transfer Protocol Protocolo de comunicação baseado no
TCP/IP. Especificação W3C
(http://www.w3.org/Protocols/) Suporta a transferencia de informação
entre o cliente e o servidor Web. Métodos GET e POST Stateless - Cookies
![Page 5: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/5.jpg)
HTTP
RequestGET /index.html HTTP/1.1 Host: www.example.com
HTTP/1.1 200 OK Response
Date: Mon, 23 May 2005 22:38:34 GMT
Server: Apache/1.3.27 (Unix) (Red-Hat/Linux)
Last-Modified: Wed, 08 Jan 2003 23:11:55 GMT
Etag: "3f80f-1b6-3e1cb03b"
Accept-Ranges: bytes
Content-Length: 438
Connection: close
Content-Type: text/html; charset=UTF-8
![Page 6: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/6.jpg)
HTTP Request
![Page 7: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/7.jpg)
HTTP Response
![Page 8: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/8.jpg)
HTTP Status Code Format Status Code
FormatMeaning Description
1yyInformational
MessageProvides general information; does not
indicate success or failure of a request.
2yy SuccessThe method was received, understood and
accepted by the server.
3yy RedirectionThe request did not fail outright, but additional
action is needed before it can be successfully completed.
4yy Client Error
The request was invalid, contained bad syntax or could not be completed for some other reason that the server believes was the client's fault.
5yy Server ErrorThe request was valid but the server was
unable to complete it due to a problem of its own.
![Page 9: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/9.jpg)
Servidor Web
Aplicação informática que trata os pedidos HTTP dos clientes Web.
Servidores mais usuais IIS – Internet Information Server
Mais usual no universo Windows Desenvolvido pela Microsoft
Apache Usual nos sistemas Unix/Linux Também existe para sistemas Windows Open Source
![Page 10: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/10.jpg)
Noção de URL
URL – Uniform Resource Location Sintaxe
Exemplos: http://www.dei.isep.ipp.pt/ades/teste.htm ftp://ftp.dei.isep.ipp.pt gopher://gopher.micro.umn.edu/11 wais://cnidr.org/directory-of-servers
protocolo://endereco/caminho/nomeFicheiro
![Page 11: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/11.jpg)
Evolução histórica
1. Páginas simplesmente estáticas O servidor Web é simplesmente um repositório
de páginas (ficheiros HTML) que são enviados para o cliente ao seu pedido.
A informação e o aspecto da página será constante ao longo do tempo. Mudando unicamente se houver intervenção do programador.
![Page 12: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/12.jpg)
Evolução histórica
2. Paginas estáticas com scripts embutidos Continuam a ser páginas estáticas São introduzidos objectos dinâmicos na página
recorrendo a uma linguagem de script. Estes scripts são interpretados e executados no browser cliente.
Suportadas pelo IE 3+ e pelo Netscape 4+ As linguagens de script mais usuais são
JavaScript VBScript
![Page 13: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/13.jpg)
Evolução histórica
3. Paginas dinâmicas O servidor constrói a página que será enviada
ao cliente. Permite interacção com recursos externos (p.e.
Bases de Dados) O aspecto e a informação da página obtida
pelo cliente depende de parâmetros que foram passados ao servidor a quando do pedido
![Page 14: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/14.jpg)
Evolução histórica
Páginas dinâmicas
Cliente
Servidor
Recursosexternos
![Page 15: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/15.jpg)
Evolução histórica
4. Paginas dinâmicas com CGI CGI – Common Gateway Interface. Existe uma aplicação no servidor (aplicação
CGI) que será invocada pelo pedido do cliente e que irá construir em tempo real a página que será enviada ao cliente.
As aplicações CGI podem ser programadas em qualquer linguagem que aceda ao STDIN e ao STDOUT. As mais usuais são:
Perl C
![Page 16: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/16.jpg)
Exemplo de um CGI/*************************************************************************/ /** **/ /**
hello_s.c -- "hello, world" simple, para demonstrar a **/ /** saida CGI basica. **/ /** **/ /*************************************************************************/
#include <stdio.h> void main() { /** Imprimir o header de resposta CGI, exigido para toda saida HTML. **/ /** Notar o \n adicional, para enviar a linha vazia. **/ printf("Content-type: text/html\n\n") ; /** Imprimir a pagina de resposta HTML em STDOUT. **/ printf("<html>\n") ; printf("<head><title>CGI Output</title></head>\n") ; printf("<body>\n") ; printf("<h1>Hello, world.</h1>\n") ; printf("</body>\n") ; printf("</html>\n") ; exit(0) ; }
![Page 17: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/17.jpg)
Evolução histórica
5. Páginas dinâmicas com código embutido O código da linguagem utilizado para a
geração da página coexiste com os comandos HTML que formatam a página.
São mais simples de desenvolver e de manter que as aplicações CGI.
As tecnologias mais usuais desta categoria são:
ASP PHP JSP
![Page 18: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/18.jpg)
Exemplo de uma página ASP <html>
<body><form action="demo_reqquery.asp" method="get">Your name:
<input type="text" name="fname" size="20" /><input type="submit" value="Submit" /></form><%dim fnamefname=Request.QueryString("fname")If fname<>"" Then Response.Write("Hello " & fname & "!<br />") Response.Write("How are you today?")End If%></body></html>
![Page 19: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/19.jpg)
Exemplo de uma página ASP <html>
<body><%response.write("<h2>You can use HTML tags to format the text!</h2>")%>
<%response.write("<p style='color:#0000ff'>This text is styled with the style attribute!</p>")%></body></html>
![Page 20: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/20.jpg)
Exemplo de PHP Form<html> <body><form action="welcome.php" method="post">
Name: <input type="text" name="name" /> Age: <input type="text" name="age" /> <input type="submit" /> </form></body>
</html>
welcome.php<html> <body>Welcome <?php echo $_POST["name"]; ?>.<br /> You are <?php echo $_POST["age"]; ?> years old.</body> </html>
![Page 21: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/21.jpg)
Exemplo de PHP
<html> <body><?php function writeMyName() { echo "Kai Jim Refsnes"; }
echo "Hello world!<br />"; echo "My name is "; writeMyName(); echo ".<br />That's right, "; writeMyName(); echo " is my name."; ?></body> </html>
![Page 22: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/22.jpg)
Evolução histórica
6. Páginas ASP .NET Beneficia da tecnologia .NET Independente do browser cliente Informação inserida no cliente é directamente
processada no servidor (conceito de Web Form)
O código utilizado para a construção da página e o código que define a interface podem ser colocados em ficheiros disjuntos (programação code-behind)
![Page 23: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/23.jpg)
WWW
The great need for information about information, to help us categorize, sort, pay for, own information is driving the design of languages for the web designed for processing by machines, rather than people. The web of human-readable document is being merged with a web of machine-understandable data. The potential of the mixture of humans and machines working together and communicating through the web could be immense. Tim Berners-Lee
![Page 24: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/24.jpg)
Q: You talked about the need for a metadata language. Can you tell us laymen what it is?
A: "Meta" is used with anything which is about itself (...) metadata is data about data. On the Web, this means all sorts of information about information(...)These needs are driving us to make ways of putting information on the web designed for computers to be able to understand. Web pages at the moment in HTML are designed to be read by humans. In the future, some Web pages will be in "RDF" -- Resource Description Framework. This will be read by computer programs which will help us organize ourselves and our data and possibly everything we do.
![Page 25: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/25.jpg)
WWW
The Semantic Web provides a common framework that allows data to be shared and reused across application, enterprise, and community boundaries. It is a collaborative effort led by W3C with participation from a large number of researchers and industrial partners. It is based on the Resource Description Framework (RDF).
The Semantic Web is a web of datahttp://www.w3.org/2001/sw/
![Page 26: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/26.jpg)
WWW
Web Ontology Language WEB 2.0
Inteligência colectiva Trabalho colaborativo Conhecimento distribuído
AJAX Assynchronous JavaScript Aplicações Web mais interactivas
![Page 27: Introdução à Arquitectura de aplicações para a Web](https://reader036.vdocuments.net/reader036/viewer/2022062418/552fc0fc497959413d8ba1c0/html5/thumbnails/27.jpg)