professor jefferson chaves [email protected] client-side ou tecnologias...

Professor Jefferson Chaves [email protected]

Jefferson de Oliveira Chaves

“ Introdução ao Ambiente Cliente x Servidor;

“ Os métodos GET e POST;

“ Formulários HTML;

“ Validação de dados;


“ HTML, CSS e JavaScript (somente essas!) são tecnologias que podem ser executadas em navegador (browser);

“ A essas tecnologias damos o nome de tecnologias Client-Side ou tecnologias do lado do cliente;

Cliente abre/requisita a página

Máquina Cliente com Web Browser

Navegador interpreta e executa o conteúdo do arquivo HTML, incluindo qualquer script

Cliente solicita a página dinâmica

HTML concluído enviado ao cliente

Servidor Web

Máquina Cliente com Web Browser

HTML pronto para enviar

Servidor executa e interpreta o código.

Constrói o código HTML

Código HTML

Jefferson de Oliveira Chaves - IFC Araquari

Então precisarei de um servidor?

Servidor é um programa de computador

responsável por aceitar pedidos HTTP de

clientes, geralmente os navegadores, e servi-los

com respostas HTTP, geralmente, páginas web,

tais como documentos HTML com objetos

incluídos (imagens, etc.)

“ O servidor Apache (ou simplesmente:

Apache) é o mais bem sucedido servidor web

livre.

“ 66% dos sites do mundo estão

hospedados em servidores Apache;

“ Seu logotipo é uma pena!

“ O servidor disponibiliza ao cliente, qualquer

arquivo solicitado desde que esteja em

sua pasta pública!

“ Cada instalação pode dar um nome diferente para essa pasta: “ public_html

“ htdocs

“ www


“ Isso significa que, se você pretende executar um código PHP em um navegador:

“ ele deverá estar na pasta publica de seu servidor;

“ o acesso deverá ser feito por meio do endereço do servidor, geralmente, http://localhost/ ou http://127.0.0.1/ seguido no nome do seu arquivo ou pasta.


http://localhost/

http://127.0.0.1/

“ Para começar a programar em PHP para web

precisaremos de alguns pré-requisitos:

“ Ter o PHP instalado em nosso computador;

“ Pode ser baixada em: http://php.net/downloads.php

“ Ter um servidor HTTP (Apache) instalado e

rodando em nossa máquina;

“ Pode ser baixado em:

https://httpd.apache.org/download.cgi

“ A fim de facilitar a instalação do PHP, Apache além de outras

configurações, um grupo de programadores criou o XAMPP, que é um pacote com tudo que precisamos.

“ Sua instalação é bem simples. Pode ser baixado em: https://www.apachefriends.org/pt_br/index.html

• O X significa que roda em qualquer sistema operacional;

• O A é de Apache;

• O M é o banco de dados;

• O P é de PHP;

• O P é de Pearl;

‚Caixa de Ferramentas ‛ para Programação em PHP

Podemos instalar o PHP e o Apache separadamente, ou apenas instalar

o xampp, o que é altamente recomendado para iniciantes.

“ O PHP (um acrônimo recursivo para PHP:

Hypertext Preprocessor) é uma linguagem de

programação open source (livre), de uso geral,

interpretada, muito utilizada, atuantes

no lado do servidor e especialmente adequada

para o desenvolvimento web e que pode ser

escrita dentro do HTML.

“ O PHP é uma linguagem flexível;

“ Escrever para Desktop (terminal) e para Web (navegador).

“ <?php e ?>

“ Permite ao PHP ser incluído em vários tipos de documentos, como uma página HTML, pois tudo que está fora dessas tags é ignorado pelo interpretador do PHP.

<!DOCTYPE HTML> <html lang="pt-br"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h1>olá visitante</h1> <p>Esperamos que goste do nosso site! </p> </body> </html>

<!DOCTYPE HTML> <html lang="pt-br"> <head> <meta charset="UTF-8"> <title></title> </head> <body>

<h1><?php echo $titulo; ?></h1> <p><?php echo $texto ; ?></p> </body> </html>

“ Existem variáveis pré-definidas no PHP,

definidas como superglobais.

“ Isso significa dizer que elas estão disponível

em todos os escopos da aplicação. Elas

sempre existem!

“ Veremos duas: $_GET e $_POST;


“ SUPERGLOBAL $_GET

“ Escrita toda em maiúscula: ela é especial!

“ Um array associativo de variáveis passadas para o script atual via o método HTTP GET;

“ Obtém os dados expostos na URL;

“ O envio repetidas vezes não tem efeitos colaterais;

“ Os dados podem ser usados para por nos favoritos;


“ SUPERGLOBAL $_GET “ Os parâmetros disponíveis na URL tem seu

início indicado pelo sinal de interrogação (?);

“ Cada parâmetro vai ser formado pelo par

chave = valor;

“ Outros parâmetros podem ser adicionados

com o uso do símbolo & ;


“ Para obter os dados disponíveis na URL

usamos a variável $_GET;

“ O conteúdo de cada parâmetro visível na

URL fica disponível como índice de GET;


“ O conteúdo de cada parâmetro visível na

URL fica disponível como índice de GET;


// ser quisermos testar antes: print_r($_GET);

$professor = $_GET[ “prof” ];

echo $professor; // O resultado será Katia

“ Podemos enviar dados para a URL por meio de:

“ Links: <a href=‚endereco?parametro=valor‛></a>

“ Formulários, veremos com detalhes no próximo tópico;


“ SUPERGLOBAIS $_POST

“ Um array associativo de variáveis passadas para o

script atual via o método HTTP POST;

“ Os dados ficam encapsulados dentro do corpo da

mensagem;

“ O usuário não “enxerga os parâmetros” enviados;

“ Normalmente usado em formulários de cadastros,

logins (envio de senhas), etc.;


“ Geralmente os dados do tipo POST são enviados por formulários com o método POST definido;


<form method=‚POST" action="">

<input type="text" name=‚busca‛ >

<input type="submit"> </form> print $_POST[‘busca’];


<?php // normalmente recebemos os dados dessa forma

$nome = $_POST['nome']; $cidade = $_POST['cidade']; $endereco = $_POST['endereco']; echo $nome; echo $cidade; echo $endereco;

“ É útil testar os dados das variáveis $_GET e $_POST

usando as funções print_r( ) e var_dump( );

“ As funções var_dump( ) e print_r( ) exibem o

conteúdo e o tipo da variável;


var_dump($_POST);

“ Como visto o PHP pode ser usado para criar

programas desktop ou para web.

“ Para programas de linha de comando, a

leitura de dados do teclado é feita pela

função fgets(STDIN);


“ Mas quando se programa para web o cenário

é diferente e a interface entre o usuário e o

PHP é feita por meio dos formulários

HTML.


“ Os formulários HTML são a principal forma de

entrada para qualquer aplicação para web.

“ Cadastros, logins e buscas são exemplos de

usos de formulários;

“ O google.com é um site que possui um único

campo de formulário e nada mais.


“ O formulário deve conter os atributos:

• Method: define a forma com que os dados serão enviados. São aceitos os métodos GET e POST.

• Action: define qual arquivos processará o conteúdo do formulário;


“ O principal elemento de um formulário é o input (entrada);

“ Os formulários possuem diferentes tipos de input’s (entradas de dados) como:

“ caixa de texto (type text);

“ caixa de senha (type password);

“ botão de enviar (type submit);


“ Para mudar o tipo de input basta dizer qual o tipo desejado no campo type:


<form method=‚POST‛> <input type="text" name=‚nome‛ > <input type=‚number" name=‚idade‛ > <input type="submit"> </form> print $_POST[‘name’];

“ O HTML5 trouxe um número expressivo de novos campos: color, date, datetime, datetime-local, email, month, number, range, search, tel, time, url, week, entre outros.


Dica: Saiba mais sobre os formulários em http://www.w3schools.com/html/html_form_input_types.asp. Pesquise sobre como usar expressões regulares em campos de formulários

“ O parâmetro action em formulários:

“ Define para onde os dados do formulários

serão enviados quando os dados forem

submetidos;

“ Se o parâmetro action estiver vazio, o

formulário enviará os dados para a própria

página;


“ O parâmetro action:


<form method=‚POST" action=‚valida.php">

<input type="text" name=‚busca‛ > <input type="submit"> </form> print $_POST[‘name’];

“ Obter os dados direto de formulários, e uma

prática inadequada e sujeito a erros;

“ Os dados não são tratados (higienizados, filtrados);

“ Sql Injection;

“ Já conhecemos as seguintes práticas:

“ $id = (int) $_GET['id']; #operacao cast

“ $cidade =trim ($_GET['id']); #elimina caracteres indesejados


“ O recomendados é usarmos a função filter_input:

“ filter_input(INPUT_GET, ‘variavel', SANITIZE_SPECIAL_CHARS)

“ filter_input(INPUT_GET, variavel ', FILTER_VALIDATE_INT);

“ Um caso conhecido (link)


https://www.google.com.br/search?q=site+mostra+paulo+henrique+ganso+corinthians&ie=utf-8&oe=utf-8&gws_rd=cr&ei=HsveVsDbAsn6wQS3h43gDw

“ O método isset( );

“ Is set? (está definida?)

“ Verifica se a variável foi definida.

“ Retorna TRUE se var existe; FALSE caso

contrário.


“ O método empty( );

“ Verifica se a variável está vazia.

“ Retorna TRUE se estiver vazia; FALSE caso a

variável testada esteja preenchida.


“ Os métodos is_:

“ O método is_bool ($variavel );

“ O método is_int ($variavel );

“ O método is_float ($variavel );

“ O método is_numeric ($variavel );

“ O método is_string ($variavel );

“ O método is_null ($variavel );


1. Crie um formulário para cadastro de clientes, contendo os campos:

Nome(text), a idade(number), o salário(?), e um para informar se o cliente é maior de idade(?)

2. Processe os dados em um arquivo chamado processa.php

3. Indique se o TIPO DE DADO de cada campo é uma texto ou numérico.

4. Se algum campo não for preenchido, exiba a mensagem: ‚nenhum campo pode ficar em branco‛


professor jefferson chaves [email protected] client-side ou tecnologias...

Documents