Dans cet article vous allez découvrir comment XOAD permet d’exporter des classes PHP vers du code Javascript par l’intermédiaire du Zend Framework.

Ce qu’il faut savoir pour comprendre cet article :

  • Avoir de bonnes bases en javascript, PHP.
  • Comprendre le design pattern MVC.
  • Savoir créer le bootstrap d’une application avec le Zend Framework.

Xoad

Xoad permet d’exporter des objets du côté serveur vers le côté client. Xoad est un environnement basé sur un ORB. Un ORB (Object Request Broker) est un ensemble de fonctions qui implément un bus logiciel par lequel des objets envoient et reçoivent des requêtes et des réponses, de manière transparente et portable.

Zend Framework

Le Zend Framework est un framework pour PHP 5 créé par Zend. Il est distribué sous la New BSD license. Le Zend Framework, aussi nommé ZF, a été développé dans le but de simplifier le développement Web tout en recommandant les bonnes pratiques et la conception orientée objets en offrant des outils puissants aux développeurs. ZF permet aussi d’utiliser nativement le principe de MVC (Modèle-Vue-Contrôleur) mais ne l’oblige pas.

Préalable

Configuration du Zend-Framework :

Si vous êtes débutant avec le ZF vous pouvez vous reporter à l’arcticle suivant : Premier pas avec le ZF .

Considérons l’arborescence suivante :

/application/
Lab/
controllers/
LabController.php
views/
scripts/
lab/
xoad.phtml
Xoad.php
/deploy/
index.php (bootstrap)
/lib/
Zend/
xoad/

Vous pouvez télécharger la librairie XOAD ici.
Nous allons créer une vue qui va nous permettre d’afficher le traditionnel “Hello world” lors du clique sur un bouton.

xoad.phtml

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml” xml:lang=“fr” lang=“fr”>
<head>
<title>Zend & XOAD tutorial</title>
                    <meta http-equiv=”Content-Type” content=”application/xhtml+xml; charset=utf-8″ />
<base href=“http://localhost/earl/deploy/”/>
<script type=“text/javascript” src=“public/lab/xoad_optimized.js”></script>
<script type=“text/javascript”>
var Lab_Xoad = <?php echo $this->jsObject ?>;
</script>
</head>
<body>
<input type=“button” id=“hello-world” value=“Hello World !”>
<script type=“text/javascript”>
document.getElementById(‘hello-world’).onclick = function ()
{
alert(Lab_Xoad.test());
};
</script>
</body>
</html>

Dans cette vue, rien d’extraordinaire :
– inclusion de la librairie javascript xoad (optimisée)
– affichage de l’objet javascript généré côté serveur et passé à la vue.

var Lab_Xoad = <?php echo $this->jsObject ?>;

– ajout d’un évènement sur le onclick d’un bouton qui va nous permettre d’afficher la réponse générée par xoad.

LabController.php

<?php
class Lab_LabController extends Zend_Controller_Action
{/**
* Specific view
*
* @var Zend_view
*/
private $_view = null;

/**
* Init zend view.
*
* @return void
*/

public function init()
{
$this->_view  = new Zend_View();
$this->_view->setScriptPath(dirname(dirname(__FILE__))  . ‘/views/scripts/’);
}

/**
* Xoad tutorial action.
*
* @return void
*/

public function xoadAction()
{
Zend_Loader::loadClass(‘Lab_Xoad’);
define(‘XOAD_AUTOHANDLE’, true);
require_once ‘xoad/xoad.php’;
$this->_view->jsObject = XOAD_Client::register(new Lab_Xoad(),‘lab/lab/xoad’);

// Render content
echo $this->_view->render(‘lab/xoad.phtml’);
}
}

Ce controller va nous permettre d’effectuer le rendu de notre vue décrite plus haut.
La méthode init nous permet de créer une vue personnalisée.
La méthode xoadAction va permettre à Xoad d’interagir avec le Zend Framework.
Particularités :
– On force le chargement de la class Lab_Xoad avec le Zend_Loader.
– On inclut la librairie xoad (située dans le repertoire lib)
– On génère l’objet javascript à partir de la méthode statique “register” en lui passant en premier paramètre la classe et en second l’url de callback utilisée par xoad
– Le fait de définir à true la constante XOAD_AUTOHANDLE permet à xoad de déterminer si l’action du controller a été appelé lors d’une requête ajax ou non, dans le cas d’une requête Ajax le script s’arrête après le require_once de la librairie xoad, le format de retour est alors du json qui servira comme outil de communication à notre objet js.

Xoad.php

<?php
class Lab_Xoad
{
public function test()
{
return ‘Hello world !’;
}
}

C’est là que ça commence à devenir interessant !

En effet, cette class va pouvoir être utilisée directement en javascript sans avoir à le modifier.
Toutes ses méthodes et ses attributs sont directement disponibles en javascript.
Vous n’avez plus à vous soucier d’écrire le code Javascript qui va se charger d’effectuer des requêtes Ajax et d’en traiter le retour.
Exemple, dans notre vue nous appelons directement la méthode suivante :

alert(Lab_Xoad.test());

Cet appel Javascript va nous retourner “Hello World”, les aller-retours serveur nécessaires vont se faire en backend.

Alors convaincu ?