I hate wizards. No, not the Harry Potter kind (although, I will confess I don’t like that kind very much either), but I hate wizards that pretend to help programmers do things. More often than not, they end up either getting in the way or hiding some magic that I need to know about. This isn’t really a problem when working with PHP, since most of the code I write in PHP is back end code and doesn’t require a UI per se. That being the case, wizards aren’t a normal part of my life. (For the record, the closest I come to using a wizard regularly is Zend_Tool but even then, I know enough about the magic going on to write my own providers, so it’s not a wizard as much as it’s just a convenience.
However, of late I have been working with Flex Builder 3 and now Flash Builder 4 (FB4). While wizards for programming might not be the norm for PHP developers, Flash and Flex developers apparently do like them. To be honest, after working with FB4 now for a few weeks, I am starting to see that wizards aren’t all bad—in fact, some of them are even kind of cool. In this two-part post, I want to talk about connecting Flex applications to server-side PHP APIs using the Data Services wizard that ships as part of FB4.
The Old Way
First, let me say that, as nice as the new Data Services are, I worked with Flex Builder 3 and really liked the old way of connecting to data services. The HTTPService object was super flexible and very simple to use—in fact, when I first started working on the code for this series, it was my intention to prove that the new way was inferior to the old way. It’s funny how technology can surprise you sometimes.
In Flex Builder 3, the way you connected to an API (XML or JSON usually) was to use something like this:
<s:HTTPService id="twitter"
showBusyCursor="true"
fault="showFault(event)"
result="doSomething(event);"
url="http://example.com/myapi" />See, that is easy. There is no behind the scenes magic: like PHP, I can get what I need done, done and move on to the next task. I’ve built several AIR and AIR2 applications using HTTPService as my multi-tool for connecting to the outside world because it is just so easy to work with; I like simple tools and HTPService was as about as simple as it got. This is why I was nonplussed when Adobe added “Data Services” to Flash Builder 4.
The New Way
When you first create an FB4 Application, you will immediately notice a difference from Flex Builder 3, the “Declarations” section of the code
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
FB4 now divides your declarations from your visual elements. That is the first thing you have to get used to. It is still easy to hand code an HTTPSerivce—you just have to put it in the new <fx:Declarations> section.
This is still my favorite method for connecting to third party web services like Twitter’s API (the Hello World of Web 2.0). Fetching data like this is dead simple, but, if you want to get into more complex operations like updates and deletions, you inevitably end up writing code by hand. Depending on the API you are talking to, this can quickly become tedious and, if you are a good OO programmer, it will most likely mean encapsulating all of this in its own class. If that sounds familiar, the new Data Services option is going to save you a lot of time and hand coding.
Figure 1: Connecting to Data Services
The “Connect to Data Service” button is on the upper right of the Data Services tab. Clicking that button will open the wizard and help you get connected.
Figure 2: Selecting Service Type
The first thing you have to do is select the type of service you are connecting to. PHP is one of your options. Selecting PHP will require you to point the wizard to the actual class you will be talking to so that it can use PHP’s reflection to gather information about the class. This means that if the API is hosed on a server you don’t have access to; you will need to use HTTP instead. While this will negate some of the benefits of the wizard, it will still set things up for you and you can manually configure your Data Service.
Figure 3: Configuring PHP Service
NOTE: For some reason, the class has to be inside your web root. Since this is considered a bad practice, you probably wouldn’t normally have the class available where Flash Builder 4 is looking. I feel confident that the answer to this conundrum is a simple configuration setting but I’ve yet to find it. For the purposes of the demo, I put everything inside of web root. I will post a follow-up post once I have a solution for this problem.
Once you have entered a class location, it will attempt to use PHP’s Reflection to pull out methods, parameters and return types. To do this, Flash Builder 4 needs Zend Framework. If you have not already configured it, you will get the following dialog box:
Figure 4: Install Zend Framework
If you already have Zend Framework installed on your system you can save yourself ~20MB by pressing cancel, backing out, finding amf_config.ini and setting the zend_path setting.
For the purposes of demonstration, let’s have it generate a sample class for us. (See Figure 3), Again, everything needs to be inside the web root for things to work properly.
NOTE: This feature is for prototyping only! The program warns you, and for good reason, that you do not want to use this code in production, ever, for any reason, period.
Figure 5: Generate a sample PHP class
Flash Builder will generate the PHP class plus all the necessary ActionScript code to manipulate a table in your database. The resulting class will have your database credentials hard coded in it and will be in your web root. You can see why it’s not a good idea to use this code in production now.
That having been said, I gave it the wp_user table from a test install of WPMU I have on my local machine and it did a good job. The PHP code is quite good. It is primarily procedural code wrapped in an object wrapper but it for prototype code, it’s good.
Since FB4 uses PHPDoc blocks as part of its introspection process, it generates the appropriate docblocks for each of the methods. In my case, it generated 6 methods necessary to add/edit/delete and list the users of my test blog. More importantly though, the wizard created 2 ActionScript classes necessary to talk to the API, _Super_WpusersService.as and WpusersService.as, both in the Services directory. The first one, _Super_WpusersService.as is where the code necessary to talk to the API is hosted. The header comment makes note that this is generated code and should not be edited. It can however, be regenerated at will. The second file, WpusersService.as, is where any customizations go. It is this class, a subclass of the first class and is the class that is actually instantiated. You can override any of the methods and add your own functionality here. This is a verbose but overall well-thought-out solution to having generated code will still allowing for modifications.
Conclusion
As you can see, connecting to PHP code from Flex is actually much easier in Flash Builder 4 and now you actually have more options with the ActonScript classes being automatically built for you. The old way of doing things still works and there are legitimate cases where it is the best answer. However the new Data Services wizard does have some nice benefits.
-
-
Figure 1: Connecting to Data Services
-
-
Figure 2: Selecting Service Type
-
-
Figure 3: Configuring PHP Service
-
-
Figure 5: Generate a sample PHP class
-
-
Figure 4: Install Zend Framework
-
If you don’t know Josh Holmes, come to TEK·X and meet him. Officially is a UX Architect Evangelist for Microsoft. Unofficially though, he is the Microsoft Ambassador to the PHP community. More than a few community members can credit Josh for helping them with problems or just finding answers and contacts within Microsoft.
