Kolaborasi Flex dan Zend (Zend_Amf_Server) Juni 7, 2009
Posted by samsonasik in Flex.Tags: flex and zend collaboration, flex and zend integration
1 comment so far
Kolaborasi Flex dengan zend bisa dengan berbagai cara, salah satunya kita bisa gunakan zend_amf sebagai jembatannya, zend_db sebagai library koneksi db nya. Berikut cara yg bisa kita lakukan dengan menggunakan zend_amf.
Pertama, kita siapkan dulu zend kita, sehingga tersusun seperti simulasi gambar berikut (tergantung documentroot masing2) :
– di sini, documentroot saya berada di /media/disk-1/web –
direktori config berisi file konfigurasi (terutama dengan database dan management environment. contoh isi file nya seperti berikut :
[production] database.adapter = "PDO_MYSQL" database.params.host = "localhost" database.params.dbname = "dokumentasiflexzend" database.params.username = "root" database.params.password = "" [development : production] database.adapter = "PDO_MYSQL" database.params.dbname = "dokumentasiflexzend" [testing : production] database.adapter = "PDO_MYSQL" database.params.dbname = "dokumentasiflexzend"
direktori library berisi library zend 1.7.4
direktori models berisi model logic program, biasanya default nya mendefinisikan relasi table (walaupun sebenarnya bisa juga digunakan untuk kebutuhan logic yg lain)
contoh isi filenya : (ceritanya, kita punya table exampletable, field2nya id dan name)
<?php
if ( ! defined('flexzendapp')) exit('No direct script access allowed');
class Exampletable extends Zend_Db_Table
{
protected $_name = "exampletable";
protected $_primary = "id";
public function getAll($keyword = null)
{
$fetch = array();
if ($keyword==null) {
$fetch = $this->fetchAll();
} else {
$fetch = $this->fetchAll("name like '%$keyword%'");
}
return $fetch;
}
}
?>
direktori services , untuk koneksitas terhadap flex, di sini saya buat contoh dua kelas, yakni ExampletableClass.php (pendefinisian field-field table) dan ExampletableService.php untuk penghubung antara models zend dan flex.
contoh source code ExampletableClass.php :
<?php
class ExampleTableClass
{
var $id;
var $name;
}
?>
contoh source code ExampletableService.php
<?php
require_once('ExampletableClass.php');
//connection info
class ExampletableService {
private $Exampletable;
public function __construct()
{
$this->Exampletable = new Exampletable();
}
public function getData($keyword=null)
{
$result = array();
$fetch = $this->Exampletable->getAll($keyword);
foreach($fetch as $key=>$val)
{
$ExampletableObj = new ExampletableClass();
$ExampletableObj->id = $val->id;
$ExampletableObj->name = $val->name;
$result[] = $ExampletableObj;
}
return $result;
}
}
?>
File includer.php berisi source load konfigurasi :
<?php
if ( ! defined('flexzendapp')) exit('No direct script access allowed');
require_once "Zend/Loader.php";
Zend_Loader::registerAutoload();
// CONFIGURATION - Setup the configuration object
$configuration = new Zend_Config_Ini('app.ini', 'production');
$dbAdapter = Zend_Db::factory($configuration->database);
Zend_Db_Table_Abstract::setDefaultAdapter($dbAdapter);
$registry = Zend_Registry::getInstance();
$registry->configuration = $configuration;
$registry->dbAdapter = $dbAdapter;
$locale = new Zend_Locale('id');
Zend_Registry::set('Zend_Locale', $locale);
?>
Nah, file index.php berisi source untuk memanggil zend_amf :
<?php
define('flexzendapp', 'flexzendapp');
set_include_path('./library' . PATH_SEPARATOR . get_include_path());
set_include_path('./config' . PATH_SEPARATOR . get_include_path());
set_include_path('./models' . PATH_SEPARATOR . get_include_path());
require_once 'includer.php';
$server = new Zend_Amf_Server();
$server->addDirectory('./services/');
echo($server -> handle());
OK, Let’s go to Flex :
Pertama : Buat sebuah project flex :
Biasakan membuat project location tidak berada di documentroot kita, supaya aman. dan supaya load data cuma flex saja (tidak campur dengan zend).
Setelah itu , klik Next
maka akan tampil seperti berikut :
PERHATIKAN OUTPUT folder, jangan sampai menimpa aplikasi kita yang lain.
Klik Next dan Finish.
maka kita akan menjumpai direktori debugging seperti ini :
Langkah selanjutnya adalah membuat file konfigurasi berbentuk xml untuk compiler setting sehingga tampil seperti berikut :
contoh isi file service-config.xml sebagai berikut :
<?xml version="1.0" encoding="UTF-8"?> <services-config> <services> <service id="amfphp-flashremoting-service" messageTypes="flex.messaging.messages.RemotingMessage"> <destination id="zendamf"> <channels> <channel ref="myamfphp"/> </channels> <properties> <source>*</source> </properties> </destination> </service> </services> <channels> <channel-definition id="myamfphp"> <endpoint uri="../zend_backend/index.php"/> </channel-definition> </channels> </services-config>
Nah, sekarang, setting compilernya , dengan cara, klik kanan project kita, klik properties, pilih flex compiler, tambahkan -services “services-config.xml” :
klik OK
Let’s coding in flex :
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="getDataExample()">
<!-- remote object untuk meremote service -->
<mx:RemoteObject id="remoteExample" destination="zendamf" source="ExampletableService"
showBusyCursor="true" fault="faultListener(event)">
<mx:method name="getData" result="getDataListener(event)"/>
</mx:RemoteObject>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.collections.ArrayCollection;
//siapkan array
[Bindable]
private var exampledata :ArrayCollection;
private function getDataListener(event:ResultEvent):void
{
exampledata = new ArrayCollection(event.result as Array) ;
}
private function faultListener(event:FaultEvent):void
{
Alert.show(event.fault.message, "Error");
}
private function getDataExample():void
{
//load data
remoteExample.getData();
}
]]>
</mx:Script>
<mx:DataGrid id="myGrid" dataProvider="{exampledata}">
<mx:columns>
<mx:DataGridColumn headerText="id" dataField="id" draggable="true" />
<mx:DataGridColumn headerText="name" dataField="name" draggable="true"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
Jika tampil seperti berikut, berarti kita sudah berhasil
:
Selamat mencoba .

