{"id":136,"date":"2009-10-24T22:22:11","date_gmt":"2009-10-24T21:22:11","guid":{"rendered":"http:\/\/muratyaman.co.uk\/wp\/?p=136"},"modified":"2020-04-01T12:14:31","modified_gmt":"2020-04-01T11:14:31","slug":"flexing-with-web-services-using-zend-amf","status":"publish","type":"post","link":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/2009\/10\/flexing-with-web-services-using-zend-amf\/","title":{"rendered":"“Flex”ing with web services using Zend AMF"},"content":{"rendered":"

PHP has always been my favourite scripting language to develop applications for the web. I have always envied Flash applications! PHP applications, to me, are a fine mixture of PHP + SQL + HTML + CSS + JavaScript. You can always add the fancy TLAs in your applications such as XML, if you want to.<\/p>\n

With FLEX, Adobe has opened doors to developers like me, who have been kept apart for years, who are unwilling to commit time to learn the complexities of Flash development.<\/p>\n

So, with the popularity of web applications and XML-like languages popping everyday, Adobe introduced (in 2004):<\/p>\n

FLEX<\/a> = Flash <\/a>+ MXML<\/a> + CSS + ActionScript<\/a>.<\/p>\n

The first unknown in our formula: MXML is XML-based language which resembles HTML + CSS + JavaScript. In a traditional web application, the engine is the browser. Here it is the Flash player.<\/p>\n

Our PHP + HTML + CSS + JavaScript codes\/files of our application are stored on the web server. But MXML code has no use until it is compiled into SWF files Flash can run. For example, SWF file can be embedded inside a HTML page and sent to the visitor’s browser where Flash player runs it. Java is required by the MXML compiler!?<\/p>\n

Straightaway, I remember OpenLaszlo<\/a>! From 2000 onwards, they had this idea of compiling codes of web developers into Flash applications. Poor guys: because of fundamental marketing flaw and approach of presentation, Adobe is now collecting the fruits instead of them. Sometimes, even the choice of the name of a product has major effects on its lifespan.<\/p>\n

Now let’s get hands dirty! I wanted to convert the user interface of my PHP Stock profiler into Flex.<\/p>\n

\"phpShareFlex\"<\/a><\/p>\n

For simplicity, I will keep all the files inside a folder on my web server; here is the folder structure of
\n\/phpShareFlex\/
\n|–\/flex\/
\n|—-services-config.xml
\n|—-phpShareFlex.mxml
\n|—-build.bat
\n|–\/service\/
\n|—-\/class.MyShareService.php
\n|—-\/index.php
\n|–\/zf\/library\/Zend\/
\n|–\/tmp\/
\n|–AC_OETags.js
\n|–phpShareFlex.swf
\n|–index.php<\/p>\n

Since I am a PHP coder, let’s write the code for our service first:
\n\/phpShareFlex\/service\/class.MyShareService.php<\/strong><\/p>\n

\r\n 'FTSE 100', 'data' => '^FTSE');\r\n\t\t$indexes[] = array('label' => 'FTSE 250', 'data' => '^FTMC');\r\n\t\treturn $indexes;\r\n\t}\r\n\r\n\t\/**\r\n\t * Get options for top combobox\r\n\t * @return array\r\n\t *\/\r\n\tpublic function getTop(){\r\n\t\t$top = array();\r\n\t\tfor($i=1; $i<=10; $i++) $top[] = array('label' => 'Top ' .($i*10), 'data' => ($i*10));\r\n\t\treturn $top;\r\n\t}\r\n\r\n\t\/**\r\n\t * Get array of share data\r\n\t * @param string $index\r\n\t * @param array $methods_arr \r\n\t * @param int $top Number of shares\r\n\t * @return array\r\n\t *\/\r\n\tpublic function getShares($index, $methods_arr, $top=10){\r\n\t\t$shares = array();\r\n\t\t$shares[] = array('code' => 'AAA', 'price' => rand(1,100), 'change' => rand(-10,10), 'volume' => rand(100,1000));\r\n\t\t$shares[] = array('code' => 'BBB', 'price' => rand(1,100), 'change' => rand(-10,10), 'volume' => rand(100,1000));\r\n\t\t$shares[] = array('code' => 'CCC', 'price' => rand(1,100), 'change' => rand(-10,10), 'volume' => rand(100,1000));\r\n\t\treturn $shares;\r\n\t}\r\n}\/\/end class\r\n?>\r\n<\/pre>\n
Note:<\/strong> phpDoc blocks are required by Zend AMF, and the system does not like the output arrays with string keys, so use integer indexes.<\/p>\n
Now, parent page to publish it:
\n\/phpShareFlex\/service\/index.php<\/strong><\/p>\n
\r\nsetProduction(FALSE);\r\n$server->setClass( \"MyShareService\" );\r\n\r\nif($myLog!=''){\r\n\t$filename = dirname(__FILE__).'\/tmp\/service.debug.'.date('YmdHis').'.txt';\r\n\tfile_put_contents($filename, $myLog);\r\n}\r\n$handle = $server->handle();\r\necho ($handle);\r\n?>\r\n<\/pre>\n
Note:<\/strong> The path of Zend Framework library is required to be able to use the classes. One of the silly tricky points was to get set_include_path<\/strong> right! Sometimes such things take hours to find out! You must have noticed my error logging function because the communication happens in the background and developing and debugging this side might be painful; just check the output files inside \/tmp\/ folder.<\/p>\n
Next is the MXML application to use our PHP Zend AMF service. Let’s define how it can communicate with our service.
\n\/phpShareFlex\/flex\/services-config.xml<\/strong><\/p>\n
\r\n\r\n\r\n    \r\n        \r\n            \r\n                \r\n                    \r\n                <\/channels>\r\n                \r\n                    *<\/source>\r\n                <\/properties>\r\n            <\/destination>\r\n        <\/service>\r\n    <\/services>\r\n    \r\n        \r\n            \r\n        <\/channel-definition>\r\n    <\/channels>\r\n<\/services-config>\r\n<\/pre>\n
\r\n\r\n\r\n\r\n\r\n<\/mx:Script>\r\n\r\n\r\n\t\r\n\t\r\n\t\r\n<\/mx:RemoteObject>\r\n\r\n\r\n\t\r\n\t\t\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t<\/mx:VBox>\r\n\t\t\t<\/mx:Canvas>\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t<\/mx:columns>\r\n\t\t\t\t\t<\/mx:DataGrid>\r\n\t\t\t\t<\/mx:VBox>\r\n\t\t\t<\/mx:Canvas>\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t<\/mx:HBox>\r\n\t\t\t\t\t\r\n\t\t\t\t<\/mx:VBox>\r\n\t\t\t<\/mx:Canvas>\r\n\t\t<\/mx:HDividedBox>\r\n\t\t\r\n\t\t\t\r\n\t\t<\/mx:VBox>\r\n\t<\/mx:VDividedBox>\r\n<\/mx:Panel>\r\n<\/mx:Application>\r\n<\/pre>\n
Note:<\/b> Like in other programming languages, there are various ways of doing the same thing: for example, I tried to stick to writing event handling functions first and then attaching them in object attributes like the click event of a button, rather than doing the job inside the MXML tags. I believe it is easier to understand: separation of code section and user interface section<\/em>, if you see what I mean \ud83d\ude09<\/p>\n
To compile this MXML application code, I have a copy of it and the services-config file on my PC and my Flex SDK is under:
\nc:\\MyApps\\FlexSDK\\<\/strong><\/p>\n
So, the build.bat<\/strong> file is simply:<\/p>\n
\r\nC:\\MyApps\\FlexSDK\\bin\\mxmlc.exe -services services-config.xml phpShareFlex.mxml\r\n<\/pre>\n
Note:<\/b> The services switch tells the compiler custom service definitions. Once the phpShareFlex.swf<\/strong> file is created, you can upload it to your web server; mine is under:
\nwww.muratyaman.co.uk\/phpShareFlex\/phpShareFlex.swf<\/strong><\/p>\n
Now, let’s present this to the world wide web either in a HTML page or PHP page; mine is:
\nwww.muratyaman.co.uk\/phpShareFlex\/index.php<\/p>\n
\r\n\r\n\r\n\r\nphpShareFlex<\/title>\r\n<script src=\"AC_OETags.js\" language=\"javascript\"><\/script>\r\n<script language=\"JavaScript\" type=\"text\/javascript\">\r\n<!--\r\n\t\/\/to be called by flex objects like link buttons\r\n\tfunction myNewWindow(url){\r\n\t\twindow.open(url);\r\n\t\treturn true;\r\n\t}\r\n\/\/ -->\r\n<\/script>\r\n<style>\r\nbody { margin: 0px; overflow:hidden }\r\n<\/style>\r\n<\/head>\r\n\r\n<body scroll='no'>\r\n<script language=\"JavaScript\" type=\"text\/javascript\">\r\n<!--\r\n\tAC_FL_RunContent(\r\n\t\t\t\t\t\"src\", \"phpShareFlex\",\r\n\t\t\t\t\t\"width\", \"100%\",\r\n\t\t\t\t\t\"height\", \"100%\",\r\n\t\t\t\t\t\"align\", \"middle\",\r\n\t\t\t\t\t\"id\", \"phpShareFlex\",\r\n\t\t\t\t\t\"quality\", \"high\",\r\n\t\t\t\t\t\"bgcolor\", \"#869ca7\",\r\n\t\t\t\t\t\"name\", \"phpShareFlex\",\r\n\t\t\t\t\t\"allowScriptAccess\",\"sameDomain\",\r\n\t\t\t\t\t\"type\", \"application\/x-shockwave-flash\",\r\n\t\t\t\t\t\"pluginspage\", \"http:\/\/www.adobe.com\/go\/getflashplayer\"\r\n\t);\r\n\/\/ -->\r\n<\/script>\r\n<noscript>\r\n\t<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\"\r\n\t\t\tid=\"phpShareFlex\" width=\"100%\" height=\"100%\"\r\n\t\t\tcodebase=\"http:\/\/fpdownload.macromedia.com\/get\/flashplayer\/current\/swflash.cab\">\r\n\t\t\t<param name=\"movie\" value=\"phpShareFlex.swf\" \/>\r\n\t\t\t<param name=\"quality\" value=\"high\" \/>\r\n\t\t\t<param name=\"bgcolor\" value=\"#869ca7\" \/>\r\n\t\t\t<param name=\"allowScriptAccess\" value=\"sameDomain\" \/>\r\n\t\t\t<embed src=\"phpShareFlex.swf\" quality=\"high\" bgcolor=\"#869ca7\"\r\n\t\t\t\twidth=\"100%\" height=\"100%\" name=\"phpShareFlex\" align=\"middle\"\r\n\t\t\t\tplay=\"true\"\r\n\t\t\t\tloop=\"false\"\r\n\t\t\t\tquality=\"high\"\r\n\t\t\t\tallowScriptAccess=\"sameDomain\"\r\n\t\t\t\ttype=\"application\/x-shockwave-flash\"\r\n\t\t\t\tpluginspage=\"http:\/\/www.adobe.com\/go\/getflashplayer\">\r\n\t\t\t<\/embed>\r\n\t<\/object>\r\n<\/noscript>\r\n<\/body>\r\n<\/html>\r\n<\/pre>\n<p><b>Note:<\/b> Main issue could be the cross site security issue (errors like “Send failed”) when RemoteObject is calling our Zend AMF service, so stick both on to the same domain\/website. The second issue during development is that you have to clear the browser’s cache to see the latest version of your FLEX application.<\/p>\n<p>In order not to increase the complexity of this sample tutorial about Flex and PHP Zend\/AMF, I have not included the actual code that gathers the share data from <a href=\"http:\/\/uk.finance.yahoo.com\/\">Yahoo Finance<\/a>, which lets you download a CSV file, given sign of a quote or share with date intervals. I have already done it in phpStockProfiler including more functions to save it locally, converting into arrays and working on the data.<\/p>\n<p>Ideally, I want to improve this application to achieve the following diagram:<\/p>\n<p><a href=\"http:\/\/www.muratyaman.co.uk\/wp\/wp-content\/uploads\/2009\/10\/flex-app-structure.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.muratyaman.co.uk\/wp\/wp-content\/uploads\/2009\/10\/flex-app-structure-300x226.jpg\" alt=\"flex-app-structure\" title=\"flex-app-structure\" width=\"300\" height=\"226\" class=\"aligncenter size-medium wp-image-149\" srcset=\"https:\/\/www.muratyaman.co.uk\/blog\/wp-content\/uploads\/2009\/10\/flex-app-structure-300x226.jpg 300w, https:\/\/www.muratyaman.co.uk\/blog\/wp-content\/uploads\/2009\/10\/flex-app-structure.jpg 1000w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>Main improvement is the processing of external data source (public CSV data from Yahoo Finance) and optimizing data flow by using a database. Next one could be a kind of queuing mechanism for concurrent requests and not to do the same calculations twice, at least for the current day, maybe. Any suggestions are welcome.<\/p>\n<p>Happy coding!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>PHP has always been my favourite scripting language to develop applications for the web.<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[32,30,28,31,26,29],"class_list":["post-136","post","type-post","status-publish","format-standard","hentry","category-technology","tag-actionscript","tag-amf","tag-flex","tag-mxml","tag-php","tag-zend"],"_links":{"self":[{"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/posts\/136","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=136"}],"version-history":[{"count":15,"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/posts\/136\/revisions"}],"predecessor-version":[{"id":932,"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/posts\/136\/revisions\/932"}],"wp:attachment":[{"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=136"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=136"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.muratyaman.co.uk\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=136"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Note:<\/b> Destination id will be required by the RemoteObject <\/a>in our MXML application. The type of channel we used is AMFChannel.
\n\/phpShareFlex\/flex\/phpShareFlex.mxml<\/strong><\/p>\n