Protocolo HTTP e HTML Prof. Danton Cavalcanti Franco Junior.
28
Seminários Avançados 3 Protocolo HTTP e HTML Prof. Danton Cavalcanti Franco Junior
Transcript of Protocolo HTTP e HTML Prof. Danton Cavalcanti Franco Junior.
Seminários Avançados 3
Protocolo HTTP e HTMLProf. Danton Cavalcanti Franco Junior
Hypertext Transfer ProtocolÉ um protocolo que trabalha na forma de pedidos e respostas (request, reponse)
Utiliza TCP/IP internamentePor padrão opera na porta 80
HTTP
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 = 1nome = livroano = 2008
Método GET
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 = 1nome = livroano = 2008Os parâmetros não ficam visíveis na URL
Método POST
Formada por:◦Status◦Cabeçalho◦Corpo
Resposta HTTP
HTTP/1.1 200 OKDate: Sat, 15 Apr 2006 18:21:25 GMT
Content-Type: text/htmlContent-Length: 200<html><head> <title> Resposta http </title> ....
Resposta HTTP - Exemplo
Códigos de resposta mais comuns:
200 - OK304 - NOT MODIFIED401 - UNAUTHORIZED403 - FORBIDDEN404 - NOT FOUND
Resposta HTTP - Códigos
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
Resposta HTTP – Content-Type
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
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
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>
Tags HTML
<HTML> <HEAD>
◦<TITLE> Título do documento </TITLE> </HEAD> <BODY>
◦Este é o corpo do documento HTML </BODY> </HTML>
Estrutura de uma página 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
Algumas Tags HTML
<TABLE border=1><TH> Nome </TH><TH> Idade </TH><TR> <TD align="center"> Joãozinho </TD> <TD align="right"> 13 </TD></TR><TR> <TD align="center"> Mariazinha </TD> <TD align="right"> 11 </TD></TR></TABLE>
Exemplo tabela
<IMG> => imagem<FONT> => formatação de fonte (fonte, cor e tamanho>
<B> => negrito<I> => itálico<U> => sublinhado<S> => riscado
Algumas Tags HTML
<A> => linkAtributos:◦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
Algumas Tags HTML
<form>◦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:
Formulários em HTML
button checkboxfile hiddenimage passwordradio resetsubmit text
<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>
Exemplo de HTML
http://www.w3schools.com/TAGS/
Referências HTML
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
Exercício
