Simple Flex Socket Client

Client-server programming is one of my passions, and I enjoy doing it in almost any language. Which makes it fitting that Flex (ActionScript) is one of my favorite languages to develop in, because it truly is a client-side technology which pretty much means it’s open to just about any type of backend server. I suppose you could make that argument with just about any language depending on how it’s being used, but since Flex isn’t processed and returned to the browser as HTML, that makes it a little different in my opinion.

Even in Flex, most applications will connect to a backend server that’s running an HTTP service (which queries the database on behalf of Flex), but I’m even going to depart from that in this post. I’m going to be demonstrating how to make socket calls to another service. You could apply this to making HTTP requests on port 80, make requests directly to a MySQL server running on port 3306. In this particular post, I will keep it simple by demonstrating how to make an HTTP request.

You declare socket like this:

import flash.net.Socket;

private var socket : Socket;

Inside an initialization method, we will add a listener for the CONNECT event, and the SOCKET_DATA event. The CONNECT event alerts us when the connection has been made, and allows us to send our request. The SOCKET_DATA event is triggered whenever there is data waiting to be read from the socket.

socket = new Socket();
socket.addEventListener( Event.CONNECT, onConnect);
socker.addEventListener( ProgressEvent.SOCKET_DATA, onSocketData);

At some point you will need to call connect on the socket, which accepts the URL of the server and the port it will be connecting to. In the onConnect() method, you will write the request using one of the writeXXX() methods, and call flush() which actually sends the data over the wire.

socket.connect(txtUrl.text, 80);

private function onConnect(event : Event) : void {
   var requestString : String = getHttp_1_1Request();
   socket.writeUTFBytes(requestString);
   socket.flush();
}

As not all socket data will be available at once, as in most client programs, you will want to read the data in a loop, using one of the readXXX() methods.

private function onSocketData(event : ProgressEvent) : void {
   while (socket.bytesAvailable) {
      txtResponse.text += socket.readUTFBytes(socket.bytesAvailable);
   }
   socket.close();
}

In general you would be checking for the end of the response you’re expecting (based on protocol), to simplify things I simply close the socket after the while loop exits the first time. If you leave the socket open for too long without reading data, I have noticed that I receive the following error, regardless of whether I have the correct policy file including cross-domain.xml:

Error #2044: Unhandled securityError:. filename.swf text=Error #2048: Security sandbox violation cannot load data from the.host.name

In this example, the raw output received from the socket request will be shown in the text box. You can download the complete source to this example here (where you may also view a screencast demo of this procedure).

Depending on what version of the Flash Player you’re running, this example may not run as-is if the server you are connecting to does not implement the policy-file (served from port 843. I will be discussing this in an upcoming post where I delve into a little more advanced socket programming in Flex, including how and where to deploy a master policy file.