Como já visto, o GET faz o envio de dados para a URL para que possamos capturar os valores.
Já o POST também faz o envio, porém, diretamente para o servidor de modo que não é necessário passar os dados pela a URL.
Quando programamos formulários, o POST se torna mais eficiente do que o GET, além de ser mais seguro ele também é transparente, ou seja, o usuário não sabe quais os dados que estão sendo passados para o servidor. Já o GET, se torna eficiente quando passamos informações de uma url para outra, portanto, é importante entender que POST e GET são utilizados em situações específicas e que um não substitui o outro. Ter domínio de programação do GET e do POST se tornam extremamente necessários para qualquer desenvolver back-end.
Prepare seu HTML para o POST
O POST somente irá ser executado se seu HTML estiver preparado para isso, podemos fazer isso de duas formas, a primeira é programando o elemento <FORM> com o atributo method=”POST”, ficando da seguinte forma:
<FORM method="POST">
...
<button type="submit"> enviar dados </button>
</FORM>
Importante: Note que na estrutra acima há um botão do tipo submit (já falamos sobre ele na aula 2 – GET), assim como o GET, o POST também necessita de um dispositivo que faça o envio dos dados (submit) e que normalmente, utilizamos um botão para isso.
A segunda forma de usar o POST é usando javascript. Nós usamos JS quando não temos um botão de submit, por exemplo; você pode programar o submit clicando em uma imagem ao invés de um botão.
<input type="image" src="/img/imagem.jpg" onClick="this.form.submit()">
Exemplo:
- Utilizando POST, crie um formulário que receba dois números e mostre o cálculo de soma entre eles quando clicar em um botão de submit.
- Crie um campo onde o usuário digite seu nome e programe uma imagem para fazer o envio do dado para o servidor usando POST. Exiba o nome do usuário na tela.
Solução:
Exemplo 01.
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>POST - Exemplo 1</title>
</head>
<body>
<FORM method="POST">
<label for="num1">Digite o primeiro número</label>
<input type="number" name="num1">
<br/>
<label for="num1">Digite o segundo número</label>
<input type="number" name="num2">
<br>
<button type="submit"> Calcular </button>
</FORM>
<?php
if ($_POST)
{
$resultado = $_POST['num1'] + $_POST['num2'];
echo("O resultado deu $resultado <br/>");
//também podemos escrever assim, usando aspas simples. echo('O resultado deu ' . $resultado); /* as aspas duplas consegue ler o valor da variável $resultado, as aspas simples não, por isso é necessário concatenar. */
}
?>
</body>
</html>
Exemplo 02.
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>POST - Exemplo 1</title>
</head>
<body>
<FORM method="POST">
<label for="num1">Digite o seu nome:</label>
<input type="text" name="nome">
<br>
<a href="#">
<input type="image" src="/img/imagem.jpg" onClick="this.form.submit()">
</a>
</FORM>
<?php
if ($_POST)
{
$resultado = $_POST['num1'] + $_POST['num2'];
echo("Olá $nome <br/>");
//também podemos escrever assim, usando aspas simples.
echo('Olá ' . $nome);
/* as aspas duplas consegue ler o valor da variável $nome, as aspas simples não,
por isso é necessário concatenar. */
}
?>
</body>
</html>
Exibir o echo somente quando o botão for pressionado
Note que nos exemplos acima o código PHP é executado junto com o carregamento da página e o echo é exibido. Para resolver isso, basta usar um IF. Quando um submit é executado a super variável $_POST passa a existir. Para verificarmos se uma variável existe ou não usamos o teste if ($var){ //se a variável existir }
");
//também podemos escrever assim, usando aspas simples.
echo('Olá ' . $nome);
/* as aspas duplas consegue ler o valor da variável $nome, as aspas simples não,
por isso é necessário concatenar. */
}
?>