Setting up debugging environment - ASP.NET and Flex Builder

July 11, 2008 at 9:07 PMAmer Gerzic

Unlike Silverlight, Flex Builder does not integrate with Visual Studio programming environment. Therefore, debugging ASP.NET or Flex applications can become very cumbersome, especially when they become very large. However, with Flex Builder 3, Adobe has made possible to utilize built in ASP.NET web server (Cassini) to debug Flex applications. Following post describes one possible way to set up both environments to make debugging easier.

Setting up Visual Studio Environment

First, let's setup VS environment. Navigate to web application's property window and select "web" as shown in the image below:

First, modify start action to be Default.aspx. In this way, the application will always start using default.aspx page, and not the active page that is edited in Visual Studio Environment. Second modification is to the Servers section. Instead of using "Auto-assign Port" option, we are choosing the port on which the web application will run. In the case above, the port is 3023. It is important to choose any port that is not already used, so staying away from well-known ports is generally good idea. At this point we are done with Visual Studio setup. Let's look at Flex Builder setup.

Setting up Flex Builder Environment

Setting up Flex Builder environment is fairly simple process. All setting that we need to change are in Properties dialog box of the relevant Flex project. The first setting that we want to modify is "Flex Build Path" as shown in the following image:

The setting that we want to modify is following:

With this setting we are modifying "Output folder" to be the folder where ASP.NET application expects *.swf file to reside. In this way, we do not have to manually copy *.swf file every time there is modification. Once the output folder is configured, we are ready to make final configuration change – the server setting as shown below:

The options that we are looking for can be found under "Run/Debug Settings" section. "Edit" the configuration for the current project and server options are presented as in image above. The trick in this case is to setup all servers to be identical to Visual Studio environment setup, which is localhost:3023/Default.aspx, i.e. we are choosing same port (3023) and page (Default.aspx).

Now, both applications can be debugged from their respective environment without any manual modifications.

Posted in: .NET | Adobe Flex | ASP.NET

Tags: , , ,

Add comment