Chris B.

JS Calls PHP

Insipirado na biblioteca DWR, resolvi desenvolver um gerador de código javascript em PHP para chamadas a objetos escritos com código PHP.

A idéia é que através de uma configuração simples, o usuário defina uma lista de classes PHP, com seus métodos, expostas para uso no javascript. Dessas classes, ele pode definir quais são os métodos e com qual nome (alias) ele quer trabalhar no javascript. No javascript, o desenvolvedor poderá chamar essa classe com a sintaxe alias.nome_do_metodo([lista_de_parametros]{, função de callback})
Através de manipulação dos dados pela engine do JS Calls PHP, os dados retornados pelo PHP para o javascript são naturalmente acessíveis. Além de string, números e booleans, objetos criados no PHP podem ser retornados através do uso da notação JSON. Com isso, podem ser acessados atributos dos mesmos através da notação nome_do_objeto.nome_do_atributo

A biblioteca é feita em cima da licensa GNU. Ou seja, pode ser usada onde quiser, livremente e de graça, modificada e melhorada.

Versão atual: 0.3

Faça download da biblioteca!

Ou, ainda, veja a lista de testes unitários, que podem servir para estudos.

Configuração

Após fazer download do pacote, você verá os arquivos básicos de utilização (além de outros para exemplos)

  • config.php (arquivo de configuração)
  • index.php
  • JSCallsPHP.js.php (código PHP gerador do código javascript)
  • engine.js
  • .htaccess (usado para possibilitar o uso de um include no javascript para cada classe PHP)

O único arquivo que vocé precisa modificar é o config.php.
Nele são definidas as classes, métodos, apelido usado no javascript e caminho do arquivo. A configuração de uma classe configurada é feita por uma sequencia de arrays, da seguinte forma:

$classes = array(
array( “debug”, “lib”, “DebugUtils”, array( “add” , “mul” , “getArray” ,  “getArrayOfArrays” , “getArrayWithKeyValue” , “getArrayOfArraysWithKeyValue” ) ));

Explicando item por item:

  • debug – apelido usado no javascript para acessar a classe
  • lib – pasta onde se encontra a classe PHP
  • DebugUtils – nome do arquivo que contém a classe (a classe deve ter o mesmo nome do arquivo)
  • array ( “add” ,  “mul” ,  “getArray” ,  “getArrayOfArrays” ,  “getArrayWithKeyValue”,  “getArrayOfArraysWithKeyValue” ) – nome dos métodos expostos

Há também uma variável jsCallsPhpInstallPath que define o caminho no qual está feita a instalação da biblioteca (se possível, coloque o caminho absoluto sem o domínio do site. Por exemplo: “/includes/jscallsphp“)

Classe PHP

Não existe segredo na classe PHP. Ela pode trabalhar da forma que quiser, acessando qualquer banco de dados por exemplo, manipulando qualquer tipo de dados ou com qualquer lógica. A única restrição é que a classe criada deve ter o mesmo nome do arquivo. Na pasta lib do pacote baixado, virá o arquivo DebugUtils.php. O código dela é:

<?php
class DebugUtils {
function __construct() {

}
function add($par1, $par2) {
return $par1 + $par2;
}
function mul($par1, $par2) {
return $par1 * $par2;
}
function getArray() {
return array(”a”, “b”, “c”, “d”, “e”);
}
function getArrayOfArrays() {
return array(array(”a”, “e”, “i”, “o”, “u”), array(”b”, “c”, “d”));
}
function getArrayWithKeyValue() {
return array(”nome”=>”Chris”, “sobrenome”=>”Benseler”);
}
function getArrayOfArraysWithKeyValue() {
return array (array ( “nome” => “Chris” , “sobrenome” => “Benseler” ), array ( “nome” => “Barack” , “sobrenome” => “Obama” ));
}
}
?>

Usando a biblioteca

Só é necessário chamar dois arquivos: engine.js e JSCallsPHP.js.php
A engine.js contém funcões utilitárias internas da biblioteca. O coração da biblioteca mesmo é o JSCallsPHP.js.php; ele que faz a leitura do arquivo de configuração e cria as classes javascript para cada classe PHP, com os respectivos métodos.
No caso da classe DebugUtils do PHP, exposta àcima, é criada uma classe javascript usando o apelido dada a ela no arquivo de configuração (debug) com os métodos definidos no arquivo de configuração (add, mul, etc…).
Acessar os métodos do objeto segue o padrão do javascript: objeto.metodo([parâmetros])
Para aumentar o poder da biblioteca, pode ser passada uma função de callback (retorno) após os parámetros do método. Com isso, caso o método chamado tenha uma valor de retorno, ele pode ser usado nessa função de callback.

Segue abaixo o conteúdo da página de testes que indiquei àcima. Pode-se ver que nela o único trabalho foi criar os links que chamam os métodos da classe debug (que é um objeto que implementa a classe DebugUtils no javascript). Conhecimentos básicos de javascript são suficientes para entender o mesmo.
Caso a sua aplicação trabalhe em cima do Apache (webserver) com mod_rewrite habilitado, ao invés de referenciar o arquivo JSCallsPHP.js.php, você pode fazer uma chamada por classe PHP pelo caminho interface/{apelido_da_classe}.js

<html>
<head>
<script type=”application/javascript” src=”engine.js”></script>
<script type=”application/javascript” src=”JSCallsPHP.js.php”></script>
<!– caso tenha mod_rewrite habilitado, pode chamar através de
<script type=”application/javascript” src=”interface/debug.js”></script>
–>
<script type=”application/javascript”>

function add() {
debug.add(10, 10, function(dataFromServer) {
alert(dataFromServer);
});
}

function mul() {
debug.mul(10, 10, function(dataFromServer) {
alert(dataFromServer);
});
}

function getArray() {
debug.getArray(function(dataFromServer) {
alert(dataFromServer);
});
}

function getArrayOfArrays() {
debug.getArrayOfArrays(function(dataFromServer) {
alert(dataFromServer);
});
}

function getArrayWithKeyValue () {
debug.getArrayWithKeyValue(function(dataFromServer) {
alert(dataFromServer.nome);
alert(dataFromServer.sobrenome);
});
}
function getArrayOfArraysWithKeyValue() {
debug.getArrayOfArraysWithKeyValue(function(dataFromServer) {
for(var i = 0; i<dataFromServer.length; i++) {
alert(dataFromServer[i].nome);
alert(dataFromServer[i].sobrenome);
}
});
}

</script>
</head>

<body>
<h1>JS Calls PHP</h1>
<h2>Exemplode uso – acesso a metodos da classe DebugUtils</h2>

<ul>
<li><a href=”#” onclick=”add(); return false;”>adicionar</a></li>
<li><a href=”#” onclick=”mul(); return false;”>multiplicar</a></li>
<li><a href=”#” onclick=”getArray(); return false;”>retornar array simples</a></li>
<li><a href=”#” onclick=”getArrayOfArrays(); return false;”>retornar array de arrays</a></li>
<li><a href=”#” onclick=”getArrayWithKeyValue(); return false;”>retornar array de dados em formato chave/valor</a></li>
<li><a href=”#” onclick=”getArrayOfArraysWithKeyValue(); return false;”>retornar array de arrays de dados em formato chave/valor</a></li>
</ul>
</body>
</html>