About deep linking
One of the benefits of an application built with Flex is that it can smoothly transition from state to state without having to fetch a new page from the server and refresh the browser. By avoiding the constant refreshing of pages, the end-user's experience is more fluid and continuous. In addition, the load on the server is greatly reduced because it need only return the application once, rather than a new page every time the user changes views.
However one of the advantages of a browser's page-oriented model is that an application's navigational state is usually clearly coupled to a URL. Thus, when the state of an application changes, the user can usually do the following:
Losing the ability to couple a browser-managed URL to a specific state of an application can be a fairly big drawback when creating applications. Deep linking adds URL-mapping or “bookmarking” capabilities to applications. At the high level, deep linking lets you do the following:
What states of your application are bookmarkable will vary by application, but possibilities include a login page, a product page, a search result page, or a drill down view into data.
Deep linking only works with certain browsers. The following browsers support deep linking:
How deep linking works
To use deep linking, you write ActionScript that sets and gets portions of the URL to determine which state the application is in. These portions are called fragments, and occur after the pound sign (“#”) in the URL. In the following example, view=1 is the fragment:
If the user navigates to a new view in your application, you update the URL and set view=2 in the URL fragment. If the user then clicks the browser’s Back button, the BrowserManager is notified of the event, and gives you a chance to change the application’s state in respond to the URL fragment changing back to view=1.
You typically use the methods of the URLUtil class to parse the URL. This class provides methods for detecting the server name, port number, and protocol of a URL. In addition, you can use the objectToString() method to convert an ActionScript object to a String that you then append to the end of a URL. Alternatively, you can convert any number of name/value pairs on a query string into an object by using the URLUtil class’s stringToObject() method. This lets you then manipulate the fragment more easily in your application logic.
Deploying applications that use deep linking
To use deep linking, your HTML wrapper requires that the following files be deployed with your application:
You must include the history.js and history.css files in your wrapper. The following example imports the JS and CSS files:
You must also deploy the historyFrame.html file with your application. This file must be located in the /history sub-directory; its location is relative to your deployed application SWF file’s location.
For Adobe®Flash® Builder™, the history.css, history.js, and historyFrame.html files are located in the flash_builder_install/sdks/4.0.0/templates/swfobject/history directory.
For the SDK, the files are located in the sdk_install/templates/swfobject/history directory.
Flash Builder generates the history.css, history.js, and historyFrame.html files in your project’s output directory if you enable deep linking in your project.