preloder

JSON – Criando o Web Service.

Esta é a aula 03 do curso de JSONVeja o cronograma completo aqui.


Como já vimos, o aplicativo deve se comunicar com o servidor, do lado do servidor temos o conjunto de códigos PHP aos quais chamaremos de Web Service. Um Web Service tem a função de disponibilizar dados para leitura. Já do lado do aplicativo temos um conjunto de códigos JSON que irão acessar o Web Service e fazer a leitura dos dados. Legal né?

Nesta aula de hoje vamos trabalhar apenas a programação do lado do servidor, ou seja, nosso Web Service.

O Projeto – Promoções de Supermercados.

Nosso aplicativo será de um um app que mostra promoções de mercados de Atibaia. A partir dos folhetos promocionais distribuídos nos mercados iremos cadastrar as promoções e exibir no nosso APP.

O Servidor

Nós iremos alimentar um banco de dados hospedado no Microsoft Azure (veja a aula – Como hospedar seu site PHP + MySQL gratuitamente no Microsoft Azure). No dashboard do portal Azure você poderá criar um banco de dados e obter um usuário e senha para programar o seu arquivo PHP.

O Banco de Dados

O banco de dados já foi criado e segue a seguinte estrutura;

tb_promocoes
– – – – – – – – – – – – – – – – – – – – – – – – –
id_promocao (int, autoincremento)
nome_do_mercado (varchar, 60) * chave secundária tipo INDEX
produto (varchar, 100) * chave secundária tipo INDEX
valor (decimal, 9,2)
validade_da_promocao (date)
imagem_do_produto (varchar, 20)
observacao (varchar, 200)

OBS: A chave secundária tipo INDEX melhora a performance nas consultas quando se utiliza o ORDER BY nome_do_mercado e/ou ORDER BY produto. Esta chave não é o mesmo que chave estrangeira.

Preparando o PHP para trabalhar com JSON

Nosso app precisa saber quais os dados que estão registrados no banco de dados, para isso, vamos criar um arquivo PHP que se conecta ao banco de dados (vou usar PDO) e que realize uma consulta na tabela tb_promocoes. Até aqui, nenhuma novidade, já vimos isso nas aulas de TPI II. Apenas fixe em sua mente: O PHP vai ser executado no servidor e não no aplicativo.

A novidade são as duas primeiras linhas que iremos acrescentar neste arquivo e a forma que a consulta será exibida na tela. Analise o código a seguir;

<?php
	/* prepara o documento para comunicação com o JSON, as duas linhas a seguir são obrigatórias 
	  para que o PHP saiba que irá se comunicar com o JSON, elas sempre devem estar no ínicio da página */
	header("Cache-Control: no-cache, no-store, must-revalidate"); // limpa o cache
	header("Access-Control-Allow-Origin: *");
	header("Content-Type: application/json; charset=utf-8"); 
	
	clearstatcache(); // limpa o cache
        // Dados do servidor de banco de Dados, neste exemplo uso Hostinger.
	$servidor = 'mysql.hostinger.com.br';
	$usuario  = 'u999961938_etec';
	$senha    = '[email protected]';
	$banco    = 'u999961938_ofert';

	try {
		$conecta = new PDO("mysql:host=$servidor;dbname=$banco", $usuario , $senha);
		$conecta->exec("set names utf8"); //permite caracteres latinos.
		$consulta = $conecta->prepare('SELECT * FROM tb_promocoes');
		$consulta->execute(array());  
		$resultadoDaConsulta = $consulta->fetchAll();
		
		$StringJson = "[";
		
	if ( count($resultadoDaConsulta) ) {
		foreach($resultadoDaConsulta as $registro) {
			
			if ($StringJson != "[") {$StringJson .= ",";}
			$StringJson .= '{"id_promocao":"' . $registro['id_promocao']  . '",';
			$StringJson .= '"nome_do_mercado":"' . $registro['nome_do_mercado']  . '",';	
			$StringJson .= '"produto":"' . $registro['produto']    . '",';	
			$StringJson .= '"valor":"' . $registro['valor']    . '",';	
			$StringJson .= '"validade_da_promocao":"' . $registro['validade_da_promocao']    . '",';	
			$StringJson .= '"imagem_do_produto":"' . $registro['imagem_do_produto']    . '",';	
			$StringJson .= '"observacao":"' . $registro['observacao'] . '"}';
		}  
		echo $StringJson . "]"; // Exibe o vettor JSON
  } 
} catch(PDOException $e) {
    echo 'ERROR: ' . $e->getMessage(); // opcional, apenas para teste
}
?>

A saída deste arquivo pode ser visto neste endereço: http://appcinema.esy.es/mobile/lista_ofertas.php

saidaJson

Tratando dados vazios de uma consulta SQL com jSon

Uma boa prática de programação sugere que retornos vazios de dados sejam tratados na estrutura jSon. Para exemplificar isso vamos usar um outro projeto.

O projeto – Sistema de Login

Neste projeto temos uma tabela no nosso banco de dados com a seguinte estrutura;

A ideia do projeto é passar para o PHP o usuário e a senha, o PHP realiza a consulta no banco de dados e retorna os valores encontrados, mas caso não encontre nenhum usuário no banco de dados a estrutura jSon deverá apresentar um alerta de usuário não encontrado.

Preparando o PHP para tratar resultados vazios em uma estrutura jSon

Basicamente, a única diferença para o projeto anterior é que iremos acrescentar um if para verificar quantas linhas de dados foram encontradas na nossa consulta ao banco de dados.


if (count($resultadoDaConsulta) === 0)
{
echo '[{"erro":"Usuário não encontrado!"}]';
return;
}

O código completo ficará desta forma;

<?php
	/* prepara o documento para comunicação com o JSON, as duas linhas a seguir são obrigatórias 
	  para que o PHP saiba que irá se comunicar com o JSON, elas sempre devem estar no ínicio da página */
	header("Cache-Control: no-cache, no-store, must-revalidate"); // limpa o cache
	header("Access-Control-Allow-Origin: *");
	header("Content-Type: application/json; charset=utf-8"); 
	
	clearstatcache(); // limpa o cache
    // Dados do servidor de banco de dados, neste exemplo uso o servidor da escola
	$servidor = 'localhost';
	$usuario  = 'você deveria saber';
	$senha    = 'você deveria saber';
	$banco    = 'bd_sistema_de_login';

	if ($_GET){
		$e = $_GET['e'];
		$p = $_GET['p'];
	} else {
		echo '[{"erro":"Sem parametros na url"}]';
		exit(); //para a aplicação PHP
	}

	try {
		$conecta = new PDO("mysql:host=$servidor;dbname=$banco", $usuario , $senha);
		$conecta->exec("set names utf8"); //permite caracteres latinos.
		$consulta = $conecta->prepare("SELECT * FROM tb01_usuarios 
									   WHERE usuario_email = '$e' 
									   AND  usuario_senha = '$p'");
		$consulta->execute(array());  
		$resultadoDaConsulta = $consulta->fetchAll();
		
		$StringJson = "[";
		
		if (count($resultadoDaConsulta) === 0)
		{
			echo '[{"erro":"Usuário não encontrado!"}]';
		}
		
		if ( count($resultadoDaConsulta) ) {
		foreach($resultadoDaConsulta as $registro) {
			
			if ($StringJson != "[") {$StringJson .= ",";}
			$StringJson .= '{"usuario_id":"' . $registro['usuario_id']  . '",';
			$StringJson .= '"usuario_nome":"' . $registro['usuario_nome']  . '",';				
            $StringJson .= '"usuario_email":"' . $registro['usuario_email']  . '",';
            $StringJson .= '"usuario_senha":"' . $registro['usuario_senha'] . '"}';
		}  
		echo $StringJson . "]"; // Exibe o vettor JSON
		
  } 
} catch(PDOException $e) {
    echo 'ERROR: ' . $e->getMessage(); // opcional, apenas para teste
}
?>

Urls de testes de um sistema de login;
jSon vazio: http://173.249.14.52/~aluno/3serie/00Anderson/webservice-applogin/login.php?e=x&p=x
jSon com dados: http://173.249.14.52/~aluno/3serie/00Anderson/webservice-applogin/login.php?e=a&p=a

Como conectar meu aplicativo ou aplicação Web ao webService.

Validando sua estrutura jSon

Antes de partirmos para a programação do aplicativo ou aplicação da web, devemos ter certeza que a saída jSon está correta, eventualmente podemos nos esquecer de alguma vírgula ou chave na hora de programar a estrutura e por isso a validação é importante.
Para fazermos a validação acesse o site JSONLint – The JSON Validator e cole a sua estrutura no campo indicado.

JS, DOM 7 ou jQuery?

Com o webservice pronto, agora podemos criar as conexões dos nossos sistemas web e aplicativos as saídas jSon gerados pelo PHP. Esta é uma aula a parte que pode ser vista em;

Aplicações Web com jQuery – Como ler uma estrutura jSON com JQuery de forma fácil.
Aplicativos com Framework 7 – Como ler uma estrutura jSON com Dom 7 (Framework 7) de forma fácil.
Aplicações Web ou Aplicativos com JavaSCript puro (DOM) – JSON – Conectando seu app ao Web Service e Consulta de dados com Ajax

Deixe seu comentário