FLEX on PHP , use AMFPHP remoting
在介紹過我們的 FLEX on ColdFusion 後，雖然可以正常進行後端的資料處理，但是老師總是告誡我們學程式語言不要押寶，在 CF 的資源在台灣仍然取得困難的情況下，還是先轉戰 PHP 陣營吧 ! 今天就來介紹一下 FLEX 如何透過 AMFPHP Remoting 與後端的 PHP 做整合。
感謝 ♣梅問題‧教學網【Minwt】♣ 贈圖一張
這篇將會是長篇大論，請各位做好起飛的準備，抓穩方向盤，拉緊手煞車。
公寓善其生，必先利其器，先來準備好我們所需要的軟體吧
| Adobe FlexBuilder 3 |  |
FLEX IDE 工具 |
| Eclipse PHP Tools |  |
PHP IDE 工具 |
| amFphp |  |
Remoting gateway |
| XAMPP for Windows |  |
Apache server PHP 編譯套件 MySQL 資料庫 |
請各位先確認好以上的東西都準備好了，當然如果你是進階 USER 也可以使用其他工具代替，只是以上我所使用的，未來範例也會都用以上軟體來執行。安裝的部分我會省略 FLEX BUILDER 的安裝，基本上這是最基礎了。
SETP 1 : 安裝 XAMPP for Windows
XAMPP 是一套免安裝的 Apache 網頁伺服器，他已經包含可以執行 PHP 能力，並且包含 MySQL 與 MAIL SERVER 與 FTP SERVER，雖然我們範例用不到，但是因為他免安裝的份上，還是很好用的，首先先將下載回來的檔案解壓縮，並且執行 setup_xampp.bat ，當完成後執行 xampp-control.exe 便可以開出 XAMPP 控制台，這時候我們只要啟動 Apache Server 即可。
預設的網頁位置在 \xampp\htdocs\ 底下，這時你可以放上一個你自己的 PHP 檔案測試是否成功，不過相信我，趕快進行下一步設定吧 !
STEP 2 : 安裝 AMFPHP 並檢視結果
第二階段就是把我們下載好的 AMFPHP 的壓縮檔解壓縮裡面會有一個 AMFPHP 的資料夾，我們將這個 AMFPHP 資料夾放入網頁的執行目錄 \xampp\htdocs\ 底下，接下來我們利用瀏覽器打開 http://127.0.0.1/amfphp/browser/ 我們會看到一個也是由 FLEX 寫好的檢查程式，這個介面可以幫助我們查看我們的方法是不是有錯，第一次開啟時我們要設定 gateway 的位置。
如果你跟我一樣是本機開啟，那只要安心的按下 SAVE 就可以囉，接下來執行看看預設的測試方法，依照順序點擊，如果正確出現方法就算安裝完成 AMFPHP 了。
但是我想你這麼聰明，應該不會有太大的問題，繼續進行下一步吧。
STEP 3 : 安裝 PHP IDE 工具 PDT
選用這套的理由是因為他是基礎於 Eclipse ，他跟 FLEX BUILDER 是同一個老爸，所以啦，在開發起來會比較有順心的感覺，一樣免安裝，在解壓縮完後執行，執行後程式會要你設定一個 workspace 任意設定即可，進入程式後你會看到以下的畫面。
接下來我們要建立 AMFPHP 所使用的 PHP CLASS 因此我們在專案中建立一個 Folder 連結到 AMFPHP 的 Services 資料夾中
當你建立好了資料夾，我們變可以新增第一隻 PHP CLASS 的程式讓 Remoting 來使用，當然不免俗的，第一隻程式永遠都是 HelloWorld 囉
HelloWorld.php
當建立好類別檔後，我們可以回到 AMFPHP 的檢視界面看看是否這隻類別可以被正常執行。http://127.0.0.1/amfphp/browser/
建立完成後可以正確顯示 HelloWorld !! 回傳字串囉，我們開始進行 FLEX 端的設定與撰寫囉。
STEP 4 : 設定 FLEX 專案進行 Remoting 連接
已經可以在 AMFPHP 檢視到自己寫的 PHP CLASS 代表已經完成一半了，但是不要開心的太早，FLEX BUILDER 這邊還是要設定一下呢。首先我們先開啟 FLEX 專案，伺服器語言的部分我們設定 PHP ，並且設定 webroot 位置。如下圖。
設定好之後我們就可以開始第二步設定 services-config.xml 一開始很納悶，這個東西到底要從哪邊來，網路上的分享也沒說要怎麼寫，只說在根目錄建立一個 service-config.xml 檔案，後來才找到這隻檔案它放在 AMFPHP 的 \browser 資料夾底下就會看到了，我們把它 COPY 到 FLEX 專案中並且打開來修改一下。
接下來我們要在專案的設定內容上做編譯設定，在專案內容的 compiler 部分加上以下參數 -services services-config.xml 便完成 FLEX 端設定。
接下來我們終於可以開始寫 FLEX 程式了，我們來做個簡單的範例，按下按鈕取得 SERVER 端的 HelloWorld 類別的 sayHello 方法，並且將回傳資料放入 TEXTAREA 區塊中，很簡單的 FLEX 程式碼，我們來試試看吧。
amfphpTest.mxml
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" fontSize="18"> <mx:TextArea width="400" height="100" text="{this.amfphpRemoting.sayHello.lastResult}"/> <mx:Button label="取得 AMFPHP 端資料" click="this.amfphpRemoting.sayHello()"/> <mx:RemoteObject id="amfphpRemoting" destination="amfphp" source="flex3.HelloWorld"/> </mx:Application>寫好了，最後只要將它執行就可以啦 ! 我們來看看結果吧 !
Random Posts
Loading…
相關文章 :
您好：
請問一下，remoteObject的source指的不是Service完整路徑名稱嗎？意即php的位置，你的HelloWorld在phpProject底下，那source應該不是flex3.HelloWorld而是phpProject.HelloWorld吧@@ 謝謝~~
您好 :
我的專案名稱的確是開 phpProject 沒錯，但是那只是 IDE 工具開的專案名稱，實際上我是新增一個 Folder 並且是直接指向 C:\xampp\htdocs\amfphp\services 資料夾的，因此實際上 HelloWorld.php 存在的位置是 C:\xampp\htdocs\amfphp\services\flex3\HelloWorld.php ，並不是專案的名稱。
很抱歉讓您混淆了， FLEX 中 RemoteObject 的 soure 屬性的定義是從 服務庫開始往下算的，而 AMFPHP 的話他的算法是從 \amfphp\services\ 開始算，因此我寫 flex3.HelloWorld 是沒有錯誤的，謝謝。
嗯嗯，搞清楚了，感謝您提供這麼詳細的教學，受益很多:)
^_^
我也剛開始摸 PHP 而已~ 不是很熟~ 正在狂 K 書中 ! PHP 連資料庫部分現在還在 TRY
頭香被搶走了~~
改天也來試試看~~
加個推推王，把好文推出去~~
推推王還不太會用
現在被 PHP 快搞死掉~
不是普通的難用耶~連想打個變數都想半天 = =a
你好,
請問XAMPP一定要安裝嗎
上次安裝過一次，但是讓我原本的appserv裡的設定都不見了，也就是127.0.0.1變成XAMPP預設的網頁，所以我就先移除安裝
還是說安裝XAMPP可以改成別的port呢，因為我原本其他程式還是有使用到appserv。
另外Eclipse PHP Tools這工具，如果我平常是使用dreamweaver編輯的話也可以嗎?還是說用此工具來設定amfphp的連結或比較方便，感謝Ausir大了!…
哈嚕 你好阿~ 一次詢問了許多問題~
XAMPP 有免安裝版，你下載 ZIP 的版本就可以不用安裝了，不過既然你有安裝 appserv 的話也可以阿，基本上能執行 PHP 就沒有問題啦，XAMPP 也是更改 PORT 的，設定方式就跟 Apache 一樣，並沒有太大差別，就目前所知 XAMPP 在使用 PDO 物件會遭遇一些問題。建議是用 PHP 正式套件。
第二點，關於 PHP 工具，沒人規定一定要用什麼工具開發，你高興的話也可以用 NOTEPAD 呢，DW基本上寫 PHP 也提供的高亮度標示基本上也不錯，但是 PDT 這套軟體提供了更多錯誤碼偵測，以及提式碼的功能，如果哪天更進階的話可以使用 Zend Studio 這套更強大的 PHP 編輯軟體，尤其 Debug 與 中斷點測試，DW 就傻掉了。與其 DW 寫錯一堆都不知道，還不如用 IDE 工具告訴我現在錯了，比較方便。
當然執行其錯誤就不在話下啦，那就需要插入中斷點了。
哈…感謝Ausir 的詳細解說，
的確用DW寫PHP缺點就是不會顯示哪裡錯誤
只有在瀏覽器上觀看才曉得code有問題
換個IDE也不錯
看到Ausir很熱血的PO好多範例
請問你研究flex多久了呢?
如果 PDT 還覺得不好用的話，可以換 Zend Studio 功能更強大，是 PDT 開發團隊開發的專業版本，要收費的 ^^”
我學 FLEX 應該也三個月了吧…可能再長一點，不過最近在玩部落格，順便把資料做個整理以後如果自己要用到比較好找，就算已經記得了，也許有人會需要，既然自己也是在網路上找資料，何不也留點資料給人家參考哩 ! 呵呵~
很喜歡你的內容，剛試一下成功了，想問一下
services-config.xml 這個檔案是用在Compiler的嗎?
恭喜你搞定了~!
謝謝你的支持 ^^”
是的 Compiler 後 發佈就不用這個檔案了
會被合併到 SWF 去喔~^^
一开始也碰到了flex3.HelloWorld的问题，因为一直都没有返回错误信息，这种方式调用很简洁，但是错误处理不够，所以还是倾向于使用
的声明方法，错了很容易就知道了！
本来回复里有代码的，但是没有显示出来，我愿意是倾向于使用 mx:RemoteObject里声明错误处理的方法，代码显示不出来，大家去查一下mx:RemoteObject里的fault=”faultHandler(event)”就明白我的意思了
請問大大
我在flex執行時出現
errors
unable to open ‘C:\Program Files\Adobe\Flex Builder 3\sdks\3.2.0\frameworks\locale\en_US-services’
由於初學所以不太清楚如何改正
不好意思，請問一下我在step2按下save出現錯誤的畫面如下，
(mx.rpc::Fault)#0 errorID = 0 faultCode = "Client.Error.MessageSend" faultDetail = "Channel.Connect.Failed error NetConnection.Call.BadVersion: " faultString = "Send failed" message = "faultCode:Client.Error.MessageSend faultString:'Send failed' faultDetail:'Channel.Connect.Failed error NetConnection.Call.BadVersion: '" name = "Error" rootCause = (Object)#1 code = "NetConnection.Call.BadVersion" description = "" details = "" level = "error"不知道要如何解決，不太清楚要怎麼處理，就一直卡關在這邊，
可否幫我解答一下，謝謝。
@miss
錯誤訊息是他無法建立連接 channel
所以你要檢查你的 gateway.php 這隻的位置
並且要給她正確的參數
才可以喔~
你要重新檢查一下你的位置~
可是我那個gateway.php是放在她路徑上的位置沒錯呀
參數是指?
不好意思，因為才開始學所以什麼都不懂。謝謝你的回答
你先用瀏覽器 先正確找到 gateway 的路徑
然後把他的網址放入那個空格試試看~
因為不確定你安裝是否有 port 或是其他路徑有改過
謝謝。我試試看喔~
Flex Project 裡面的 Root URL 這個欄位是什麼用途阿
我自己嘗試過很多次，好像只能寫本機的位址
例如http://localhost or 127.0.0.1 or 我的真實IP
這個欄位能夠寫一台網路上的 apache server 位址嗎？
http://mac1.ccns.ncku.edu.tw/wordpress/2009/07/20/flex_amfphp/
這篇是我看完你的文章之後實作的心得
想要請教一下 Flex remoting 要如何才能 call 到遠端機器的 php 程式碼？
@玉米
root URL 他是說執行的時候要在 IE 內連線到哪個 SERVER
因此如果你是把檔案放在遠端的 SERVER 上 也可以用其他電腦的 IP 阿
不管是內部 或是 外部都可以的啦~
還有阿…
FLEX 怎麼可能綁死在 WIN 平台上阿~QQ
你現在看我的網站都是上傳到虛擬主機的 PHP 平台阿
應該說當你在本機開發完要上傳你要修改某些地方
不然在連線的 gateway 會有問題 所以才會連線不到
至於如果要 CALL 遠端主機的 PHP 這個問題
對方主機必須在網站的跟目錄有一個 crossdomain.xml 的檔案
並且允許你FLASH 的存取才可以喔~~
^_^ 不知道有沒有幫上忙~
DEAR @玉米
看過你的文章~ 讓我想把事情解釋清楚一點~
基本上你說要改 root URL 是可以的
例如你有一台 SERVER 他的 IP 是 192.168.1.200 ( 我用內部IP來講解)
然後你自己安裝 flex builder 的電腦是 192.168.1.10
然後你把 SERVER 上的 HTTP 資料夾分享 並且在本機建立連線磁碟機
\\192.168.1.200\httproot => h:\
這時候你就必須在 web root 的地方輸入 h:\
所以你在 root url 的地方就要輸入 http://192.168.1.200
而不是你本機的 IP 192.168.1.10 了喔
這樣說你了解了嘛~~?
也就是說其實也可以上傳到遠端的 SERVER 的~
感謝！搞定囉！
請問我本機沒有localhost,而server上有上傳amfphp
那我這 destination=”amfphp” 應怎麼設才能在flexbuilder run呢???
目前測試是找得到source卻找不到destination=”amfphp”
@大頭
你要修改圖片上的這個位置
http://files.corausir.org/images/uploads/2009/02/image85.png
把 localhost 改成你上傳的遠端 SERVER IP
非常感謝你熱心又迅速的回答
搞定了！非常非常高興….
接下來我們利用瀏覽器打開 http://127.0.0.1/amfphp/browser/
我無法開啟耶
@Forgot
自問自答
我把XAMPP選擇自動安裝就搞定了
再想請問 我遇到跟Miss一樣的問題
然後我在瀏覽器中打 http://127.0.0.1/amfphp/gateway.php
然會跳到一個網頁上寫著
amfphp and this gateway are installed correctly. You may now connect to this gateway from Flash.
Note: If you’re reading an old tutorial, it will tell you that you should see a download window instead of this message. This confused people so this is the new behaviour starting from amfphp 1.2.
之後我再回去步驟二，可是還是出現同樣的問題?
請問這也是gateway沒設好嗎
@Forgot
amfphp and this gateway are installed correctly. You may now connect to this gateway from Flash.
翻譯 : AMFPHP 跟 這個閘道已經被正確的安裝，也許你現在可以從 FLASH 嘗試連接這個閘道
所以你輸入這個網址
http://127.0.0.1/amfphp/browser/
應該就可以使用 remoting 囉
我後來直接灌appserve就可以了耶
可是現在在flex裡要執行時碰到了
unable to open ‘C:\Program Files\Adobe\Flex Builder 3\sdks\3.2.0\frameworks\locale\en_US-services’
正在努力解決
@Forgot
耶 = = 因為你 en_US 跟 -services 中間有一個空白喔
不要忘記了
沒錯 我剛要回來回 你就幫我解答了!!!
@Forgot
^_^ 革命尚未成功 同志仍須努力
報告報告!我革命成功了
目前正再努力推翻下一個朝代
@Forgot
努力努力~~努力阿~~~
就是要跟你在一起~~
Severity and Description Path Resource Location Creation Time Id
unable to open ’services-config.xml’ login Unknown 1255273597703 48
請問大大 它出現無法開啟services-config.xml 這要怎麼解決呢?
@SSS
這個錯誤碼是甚麼情況下出現的~~??
不知道各位是否有遇到php5.3以上出現以下錯誤呢?
開啟http://127.0.0.1/amfphp/browser/→出現以下錯誤….囧
Error retrieving service info:
Function eregi_replace() is deprecated
D:\*\amfphp\core\shared\util\MethodTable.php on line 505
@老諾皮
已找到解決方案了：要改掉505和507這兩行就可以正確啟用amfphp了喔！
解决方法:
將錯誤語句↓
505：$comment = eregi_replace(”\n[ \t]+”, “\n”, trim($comment));
507：$comment = eregi_replace(”[\t ]+”, ” “, trim($comment));
替换成↓
505：$comment = preg_replace(”\n[ \t]i”, “\n”, trim($comment));
507：$comment = preg_replace(”[\t ]i”, ” “, trim($comment));
這樣amfphp就不會跟php5.3以上的版本衝到…問題解決…！密山羊哥不理我- -
@老諾皮
帥哥~
人家我才剛回到家就看到你自問自答囉~
先謝謝你的分享 ^_^
我 MSN 晚上大多用公司的電腦掛著
要等到白天才會回啦~~
@Ausir
Fatal error: Uncaught exception ‘VerboseException’ with message ‘Non-static method CharsetHandler::setMethod() should not be called statically, assuming $this from incompatible context’ in C:\AppServ\www\amfphp\core\amf\app\Gateway.php:134 Stack trace: #0 C:\AppServ\www\amfphp\core\amf\app\Gateway.php(134): amfErrorHandler(2048, ‘Non-static meth…’, ‘C:\AppServ\www\…’, 134, Array) #1 C:\AppServ\www\amfphp\gateway.php(154): Gateway->service() #2 {main} thrown in C:\AppServ\www\amfphp\core\amf\app\Gateway.php on line 134
請大ausir大大
我也遇到與miss差不多的問題
我直接去開啟gateway.php
然後跑出以上訊息
我用的app版本是php6
不知道這有沒有關係的說!?
還有請ausir大大指點一下~謝謝
@疾風烈神
DEAR 聽說 PHP 5.3 以上會有問題
你可以參考樓上老諾皮的解決方案
Dear, 感謝貢獻這麼好的教學。
我遇到一個百思不解的問題，要請教一下:我根據你的教學試做，一切都沒問題，但是我把flex compiler好的檔案及資料庫和php檔copy到另一台已安裝xampp的電腦下同樣對映的目錄下做測試，網頁可以正常開啟，但是卻無法抓到資料庫的內容，datagrid也沒有任何資料欄位顯示。可是我到”http://127.0.0.1/amfphp/browser/”測試卻可以正確抓到該資料庫的回應。
這到底是怎麼回事? 是不是”services-config”要修改，還是有漏了什麼檔案?
請Ausir大，解惑一下。小弟已搞了兩天了。頭都表抓破了。
謝謝~~~!
@indy
如果你在 AMFPHP 的 BROWAER 可以正確讀到資料
但是 FLEX 不可以
那就一定是你的 servicesconfig.xml 設定有問題
再檢查一下巴 ^^
Hello!
請問您在下參數 -services services-config.xml這個部份,因為如果我這樣下
的話,它是無法找到這支檔案的位置,必須給予絕對路徑才有辦法解決,因為好像大部
份找到的教學資源都沒有提及是要給予絕對路徑的,不知道是不是個案(?),謝謝!
自己回一下,原來是要複製到src下面的差別!
小弟最近在測試時
使用appserv 2.5.10+flex builder 4+amfphp1.9(flex project使用flex SDK 3.5)
到step3都ok 可以回傳值
只是到最後一步flex卻沒有顯示hello world…
請問是flex版本的問題嗎?是否語法或哪裡需要變動?
謝謝!!
@Dragonming
Flash builder 有兩套 SDK
建議你可以更換 3.5 的版本測試看看
升級到 4 還是會有些許不同
目前我們的專案仍維持在 3.2