Protocolo HTTP e HTML Prof. Danton Cavalcanti Franco Junior Seminários Avançados 3 Protocolo HTTP e HTML Prof. Danton Cavalcanti Franco Junior
HTTP Hypertext Transfer Protocol É um protocolo que trabalha na forma de pedidos e respostas (request, reponse) Utiliza TCP/IP internamente Por padrão opera na porta 80
Método GET Os parâmetros da requisição são enviados na própria URL Exemplo: http://localhost/cadastraproduto? cod=1&nome=livro&ano=2008
Método GET Onde: ? => utilizado para separar o endereço dos parâmetros & => utilizado para separar um parâmetro do outro
Método GET http://localhost/cadastraproduto? cod=1&nome=livro&ano=2008 Endereço: http://localhost/cadastraproduto Parâmetros: cod = 1 nome = livro ano = 2008
Método POST Os parâmetros são enviados no corpo da requisição, invisíveis ao usuário. Geralmente utilizado através de formulários para enviar dados ao servidor
Método POST Endereço: http://localhost/cadastraproduto Parâmetros: cod = 1 nome = livro ano = 2008 Os parâmetros não ficam visíveis na URL
Resposta HTTP Formada por: Status Cabeçalho Corpo
Resposta HTTP - Exemplo HTTP/1.1 200 OK Date: Sat, 15 Apr 2006 18:21:25 GMT Content-Type: text/html Content-Length: 200 <html> <head> <title> Resposta http </title> ....
Resposta HTTP - Códigos Códigos de resposta mais comuns: 200 - OK 304 - NOT MODIFIED 401 - UNAUTHORIZED 403 - FORBIDDEN 404 - NOT FOUND
Resposta HTTP – Content-Type Indica o tipo do conteúdo no corpo da resposta. Utiliza o formato “tipo/subtipo” Exemplos: Content-Type: text/html Content-Type: image/jpeg Content-Type: application/pdf
HTML Hypertext Markup Language É uma linguagem de marcação utilizada para produzir páginas na Web É interpretada pelos navegadores Web, que exibem o conteúdo das páginas
HTML As marcações são feitas através de tags (etiquetas) incorporadas ao texto da página Atenção: HTML não é uma linguagem de programação, é uma linguagem de formatação
Tags HTML Definem a formatação de uma parte do texto Representadas entre sinais de maior e menor (<tag>) A grande maioria das tags devem ser fechadas, através da representação </tag>
Tags HTML Formada pelo próprio comando, atributos e valores. Exemplos: <HR color=“blue”> <H1> Título do documento </H1>
Estrutura de uma página HTML <HEAD> <TITLE> Título do documento </TITLE> </HEAD> <BODY> Este é o corpo do documento HTML </BODY> </HTML>
Algumas Tags HTML <BR> => quebra de linha <P> => novo parágrafo <H1>...<H6> =>títulos <HR> => desenha uma linha <OL> => lista numerada <UL> => lista não numerada <LI> => item de uma lista
Algumas Tags HTML <TABLE> => define uma tabela <TH> => cabeçalho de coluna <TR> => linha da tabela <TD> => célula da tabela
Exemplo tabela <TABLE border=1> <TH> Nome </TH> <TH> Idade </TH> <TR> <TD align="center"> Joãozinho </TD> <TD align="right"> 13 </TD> </TR> <TD align="center"> Mariazinha </TD> <TD align="right"> 11 </TD> </TABLE>
Algumas Tags HTML <IMG> => imagem <FONT> => formatação de fonte (fonte, cor e tamanho> <B> => negrito <I> => itálico <U> => sublinhado <S> => riscado
Algumas Tags HTML <A> => link Atributos: href => destino do link name => âncora de destino (link para mesma página)
Algumas Tags HTML Exemplo: Clique <A HREF=“http://www.globo.com> aqui </A> para ir ao site da Globo.com
Formulários em HTML <form> <input> atributo action => ação do formulário atributo method => método de envio <input> atributo type => tipo da entrada Atributo name => nome da entrada atributo value => valor padrão da entrada
Formulários em HTML Tipos de input: button checkbox file hidden image password radio reset submit text
Exemplo de HTML <HTML> <HEAD> <TITLE> Exemplo de HTML </TITLE> <BODY> <FORM action=validausuario.jsp method=“get”> Login: <INPUT type=“text” name=“login”> <BR> Senha: <INPUT type="password" name="passw"> <BR> <INPUT type="submit" value="Enviar"> <INPUT type="reset" value="Limpar"> </FORM> </BODY> </HTML>
Referências HTML http://www.w3schools.com/TAGS/
Exercício Criar um formulário de cadastro com os seguintes campos: Código Nome Senha Confirmação da senha Data nascimento Sexo (Masculino/Feminino) Email Autoriza o recebimento de email Tipo da pessoa (Física/Jurídica)
Exercício Deve-se criar uma tabela para fazer o alinhamento A descrição do campo deve ser alinhada a direita O componente do formulário deve ser alinhado a esquerda A ação do formulário deve ser “cadastro” Utilizar o método “post” Deve-se disponibilizar um botão para limpar o formulário Todos os componentes do formulário devem ser nomeados