Using variables from the URL

When you develop an application or simple example in Flash, you might want to pass values from an HTML page into your Flash document. The passed values are sometimes known as the query string, or URL-encoded variables. URL variables are useful if you want to create a menu in Flash, for example. You can initialize the menu to show the correct navigation by default. Or you can build an image viewer in Flash and define a default image to show on the website.

To use URL variables in a document:

  1. Create a Flash document, and name it urlvariables.fla.
  2. Select File > Save As, and save the document on your desktop.
  3. Select Frame 1 of the Timeline, and add the following code in the Actions panel:
    this.createTextField("myTxt", 100, 0, 0, 100, 20);
    myTxt.autoSize = "left";
    myTxt.text = _level0.myURL;
    
  4. Select Control > Test Movie to test the SWF file in Flash Player.

    The text field displays undefined. If you want to make sure the variables are properly defined before you proceed, you need to check for the existence of the variables in Flash. You can do this by checking to see if they are undefined.

  5. To check to see if the variable is defined, modify the ActionScript you added to the Actions panel in step 3 to match the following code. Add the code that appears in bold:
    this.createTextField("myTxt", 100, 0, 0, 100, 20);
    myTxt.autoSize = "left";
    if (_level0.myURL == undefined) {
        myTxt.text = "myURL is not defined";
    } else {
        myTxt.text = _level0.myURL;
    }
    

    When you publish your Flash document, an HTML document is created by default in the same directory as the SWF file. If an HTML file was not created, select File > Publish settings, and make sure you select HTML in the Formats tab. Then publish your document again.

    The following code demonstrates the HTML in the document that is responsible for embedding a Flash document in an HTML page. You need to look at this HTML to understand how URL variables work in the following step (where you add additional code for URL variables).

    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="550" height="400" id="urlvariables" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="urlvariables.swf" />
    <param name="quality" value="high" />
    <param name="bgcolor" value="#ffffff" />
    <embed src="urlvariables.swf" quality="high" bgcolor="#ffffff" width="550" height="400" name="urlvariables" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
    </object>
    
  6. To pass variables from the generated HTML document to your Flash document, you can pass variables after the path and filename (urlvariables.swf). Add the bold text to the HTML file that was generated on your desktop.
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="550" height="400" id="urlvariables" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="urlvariables.swf?myURL=http://weblogs.macromedia.com" />
    <param name="quality" value="high" />
    <param name="bgcolor" value="#ffffff" />
    <embed src="urlvariables.swf?myURL=http://weblogs.macromedia.com" quality="high" bgcolor="#ffffff" width="550" height="400" name="urlvariables" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
    </object>
    
  7. If you want to pass multiple variables to Flash, you need to separate the name/values pairs with an ampersand (&). Find the following code from step 6:
    ?myURL=http://weblogs.macromedia.com
    

    Replace it with the following text:

    ?myURL=http://weblogs.macromedia.com&myTitle=adobe+News+Aggregator
    

    Remember, you need to make the same changes to both the object tag and the embed tag to maintain consistency between all browsers. You might notice that the words are separated by + punctuators. The words are separated this way because the values are URL-encoded and the + punctuator represents a single blank space.

    NOTE

    For a list of common URL-encoded special characters, see the Flash TechNote, URL Encoding: Reading special characters from a text file.

    Because the ampersand (&) serves as a delimiter for different name/value pairs, if the values you are passing contain ampersands, unexpected results might occur. Given the nature of name/value pairs and parsing, if you had the following values being passed to Flash:

    my.swf?name=PB+&+J&flavor=strawberry+rhubarb
    

    Flash would build the following variables (and values) into the root scope:

    'name': 'PB ' (note space at end of value)
    ' J': '' (note space at beginning of variable name and an empty value)
    'flavor': 'strawberry rhubarb'
    

    To avoid this, you need to escape the ampersand (&) character in the name/value pair with its URL-encoded equivalent (%26).

  8. Open the urlvariables.html document, and find the following code:
    ?myURL=http://weblogs.macromedia.com&myTitle=Adobe+News+Aggregator
    

    Replace it with the following code:

    ?myURL=PB+%26+J&flavor=strawberry+rhubarb
    
  9. Save the revised HTML, and test your Flash document again.

    You see that Flash created the following name/value pairs.

    'name': 'PB & J'
    'flavor': 'strawberry rhubarb'
    

    NOTE

    All browsers will support string sizes as large as 64K (65535 bytes) in length. FlashVars must be assigned in both the object and embed tags in order to work on all browsers.