Tutorial: Using Flash CS3 to access Amazon's SimpleDB

Post to Twitter

There are several ways to interact with Amazon’s SimpleDB including PHP, Java, Python, Ruby, etc. Today though I want to walk you through using Amazon’s SimpleDB from an ActionScript 3 library submitted by illustratedlife.

To work through this tutorial you will need the following:
1. The AS3 library supplied by illustratedlife
2. Flash CS3 (Flash CS4 should work too, but I don’t yet have it to test it out). If you don’t own it, the trial version should work just fine.
3. You will need an active Amazon Web Services account and you must be enrolled in the current SimpleDB beta. This will give you the access keys you will need to test out the sample app we are about to build.

You can easily modify this tutorial to work with Flex 3 if you wanted to. I will be using Flash CS3 for this tutorial as mentioned.

An important note before you go any further: I’m not going to be using the “mock” AWS objects which means I’m hitting SimpleDB directly. This means that each “hit” costs money. So if your following along with this tutorial and have a valid AWS account please be aware that Amazon is going to charge you money. I’m not responsible for any charges you incur with this tutorial – you do this at your own risk and expense. The last thing I want is someone to write and endless loop creating Domains or something and then walking away from the computer to get a drink and racking up a bunch of monetary charges they now owe to Amazon blaming me.

First, download the AS3 library for SimpleDB and extract the files. Now open up Flash CS3 and from the menu choose: File -> New Document and pick “Flash File (ActionScript 3)”. Leave the default size to 550px by 400px however I’m going to change my background color to #EEEEEE. You can set that color to whatever you want (I find white distracting most times so its a personal preference). Save this file to a new folder called “FlashAWS” and call the file “FlashSimpleDB.fla”.

Now you need to copy in some files from the library we extracted earlier. Go to the folder where you extracted the downloaded AS3 library and copy over the “com” folder and every folder below it into the “FlashAWS” folder where you saved your project.

We can layout the interface now. So go back to the Flash IDE and drag the following components onto the designer:
1. Two buttons
2. One textarea
3. One textinput

I used the following properties for these controls:

Button One
Name = execute_btn
Label = Execute
X = 396, Y = 25
Width = 130, Height = 22

Button Two
Name = clearResults_btn
Label = Clear Results
X = 396, Y = 75
Width = 130, Height = 22

TextInput
Name = input_txt
X = 36, Y = 26
Width = 314, Height = 22

TextArea
Name = results_txt
veritcalScrollPolicy = on
X = 36, Y = 76
Width = 325, Height = 300

Obviously this is a very basic interface. Lets move onto the code where the magic happens. Normally you will want to structure your ActionScript code into nicely crafted classes, etc. Since this is a simple tutorial I’m just going to put the code into the first frame on the timeline.

Add the following ActionScript to the first frame of the timeline:

// Import the library
import com.theillustratedlife.AWS.*;

// Create a new instance of the SimpleDB class
var simpleDB = new SimpleDB();
// Set our Amazon Web Service keys
simpleDB.accessKey ="YOUR AMAZON ACCESS KEY HERE";
simpleDB.secretKey ="YOUR AMAZON SECRET KEY HERE";

Lets pause here for a moment. Unless you actually have a valid set of Amazon Web Services keys that have access to SimpleDB this tutorial won’t work. So if you haven’t already, go get those keys and keep in mind this will cost you real money.

The code should be pretty easy to grasp. We import the library and then create an instance of the SimpleDB class. We then need to set our keys, obviously I’m not going to publish mine, so you will need to substitute in your own.

Below the code we just typed in add this code:

// Add the event listeners for the buttons
execute_btn.addEventListener(MouseEvent.CLICK, executeRequest);
clearResults_btn.addEventListener(MouseEvent.CLICK, clearResults);

function executeRequest(evt:Event):void
{
	trace("executeRequest called");
}

function clearResults(evt:Event):void
{
	trace("clearResults called");
}

This code adds in the event handlers for the two buttons. Run the project right now and click the buttons, hopefully you see something like this:

Lets modify the code one more time in order to run our first test:

function executeRequest(evt:Event):void
{
	simpleDB.createDomain(input_txt.text);
	simpleDB.addEventListener(AWSEvent.DOMAIN_CREATED, onIncomingResults, false, 0, true);
}

function clearResults(evt:Event):void
{
	results_txt.text = "";
}

function onIncomingResults(event:AWSEvent)
{
	results_txt.text = "Event Type: " + event.type + "\n\nResponse:\n" + event.response;
}

We’ve removed the trace calls and added some SimpleDB code to add a domain (kinda like a database “table”) called “MyDomain”. Run this project and in the textinput control type in “MyDomain” and press the execute button. If you wait a few seconds you should get a response that the domain has been created.

At this point add one more domain called “MyDomain2″.

Lets now ensure these domains exists by listing them. Modify your code to look like this:

function executeRequest(evt:Event):void
{
	//simpleDB.createDomain(input_txt.text);
	//simpleDB.addEventListener(AWSEvent.DOMAIN_CREATED, onIncomingResults, false, 0, true);
	simpleDB.listDomains();
	simpleDB.addEventListener(AWSEvent.DOMAINS_LISTED, onIncomingResults, false, 0, true);
}

Run the project again and this time just click on the “Execute” button. You should see your domain get listed in the results textarea control.

There are the two domains so you can see that both got listed and of course you will notice our result came back in the form of XML.

Lets modify the code one last time, here is the full code listing.

// Import the library
import com.theillustratedlife.AWS.*;

// Create a new instance of the SimpleDB class
var simpleDB = new SimpleDB();
// Set our Amazon Web Service keys
simpleDB.accessKey ="YOUR AMAZON ACCESS KEY HERE";
simpleDB.secretKey ="YOUR AMAZON SECRET KEY HERE";

// Add the event listeners for the buttons
execute_btn.addEventListener(MouseEvent.CLICK, executeRequest);
clearResults_btn.addEventListener(MouseEvent.CLICK, clearResults);

simpleDB.addEventListener(AWSEvent.DOMAINS_LISTED, onIncomingResults, false, 0, true);
simpleDB.addEventListener(AWSEvent.DOMAIN_CREATED, onIncomingResults, false, 0, true);
simpleDB.addEventListener(AWSEvent.DOMAIN_DELETED, onIncomingResults, false, 0, true);

function executeRequest(evt:Event):void
{
	//simpleDB.createDomain(input_txt.text);
	simpleDB.deleteDomain(input_txt.text);
    //simpleDB.listDomains();
}

function clearResults(evt:Event):void
{
	results_txt.text = "";
}

function onIncomingResults(event:AWSEvent)
{
	results_txt.text += "Event Type: " + event.type + "\n\nResponse:\n" + event.response + "\n\n";
}

Note all the code changes. Run the project again, type in “MyDomain” in the textinput and press execute. Here are my results which you can see “MyDomain” is now gone:

.

We should still have one domain left called “MyDomain2″. I’ll verify that:

function executeRequest(evt:Event):void
{
	//simpleDB.createDomain(input_txt.text);
	//simpleDB.deleteDomain(input_txt.text);
	simpleDB.listDomains();
}

Modify the code and press “Execute” again and voila, there is the last domain listed:

SimpleDB is easy to learn and use and the AS3 SimpleDB library by illustratedlife makes it all very easy to work with in Flash and Flex projects.

Of course now that you know the basics you can move onto adding items (like database rows) and attributes. Take a look at the FLA file that came with the AS3 SimpleDB library for code examples on how to do that.

You can download the project files here.

Post to Twitter

This entry was posted in ActionScript, Adobe, Amazon Web Services, Flash, Flex. Bookmark the permalink.

7 Responses to Tutorial: Using Flash CS3 to access Amazon's SimpleDB

  1. Pingback: Flash CS3???illustratedlife?ActionScript 3 library??Amazon?SimpleDB??? | ??Flex??

  2. Pingback: A Tutorial Teaches You How to Access Amazon SimpleDB by ActionScript 3 Library In Flash CS3 | FlexMan

  3. Brett says:

    Have you posted this to the SimpleDB Resource Center?

  4. Chad Lung says:

    @Brett

    I made a post to the SimpleDB forums in regards to this tutorial.

    Chad

  5. grig says:

    isn’t it a bad idea to embed your secret key in the flash app? there are tools out there that will reveal the flash code!

  6. Chad Lung says:

    @grig,

    It is a bad idea to put any secret key in your Flash/Flex app because the SWFs can be decompiled. If your building a SWF for the general public then your better off making calls into a PHP, ASP.NET, Web Service, etc. and having it make the calls for you and thus keeping the keys a secret on the server side. If your the only consumer of the SWF (perhaps its a front end to an admin console of yours) then its fine to leave them in there.

    Chad

  7. Jorge says:

    Hi Chad

    Thank you for this interesting info. I’m new to the Flash/AIR platform so I don’t understand the following. If you go to the link you posted to download the library it says:

    “Note, you must target AIR to use this library; SimpleDB does not have a crossdomain policy posted, and Flash’s security settings won’t let you talk to a host without a crossdomain, unless you are using AIR.”.

    Ok, my question is: May I execute my Flash game from inside the web browser if I target AIR?

    Best Regards,
    Jorge

Comments are closed.