blackcj.com » Password http://www.blackcj.com/blog Cutting edge development with Adobe Flex, ActionScript and AIR Thu, 15 Dec 2011 01:01:57 +0000 en hourly 1 http://wordpress.org/?v=3.3 Adding Server Side Captcha to Flash Forms http://www.blackcj.com/blog/2009/11/23/adding-server-side-captcha-to-flash-forms/ http://www.blackcj.com/blog/2009/11/23/adding-server-side-captcha-to-flash-forms/#comments Mon, 23 Nov 2009 17:06:40 +0000 Chris Black http://www.blackcj.com/blog/?p=587 Problem:
Flash forms are very vulnerable to attacks. Spiders may not be able to easily iterate through your Flash content but they can sure spam your form submission URL. How can you be sure your form was submitted through Flash?

Definition:
A CAPTCHA or Captcha is a type of challenge-response test used in computing to ensure that the response is not generated by a computer.

Solution:
What if we have a user drag a circle onto a box? A spider would have a pretty hard time with that, right? WRONG. While this may be a good filter at the view level it still does not solve our problem. All the hacker would need to do is submit the form correctly one time and use a program like Firebug to sniff the submission URL. They could then completely bypass your view and submit the form as many times as they want.

The only way to ensure the Flash form is being used is to pull the logic out of the view and onto the server. The Flash merely serves up content and never knows what the 'answer' is. In this example we will use PHP to generate the image, MySQL to store the key value pairs, and Flash to display the content. This implementation does not require any images to be stored on the server so it NEVER re-uses an existing image. The PHP generates the image on the fly and serves it directly to the Flash application.

Here is a diagram representing the high level information. Blue lines represent Captcha generation and the red lines represent the Captcha verification.

Server Side Captcha in Flash

Server Side Captcha in Flash

Let's start with the PHP. There are already plenty of PHP scripts out there to generate Captcha. In this example I re-purposed a script called Securimage.

First we need a script that will retrieve the image:

PLAIN TEXT
PHP:
  1. <?php
  2. $flash_id = $_GET['flash_id'];
  3. include 'securimage.php';
  4. $img = new securimage();
  5. $img->show($flash_id); // alternate use:  $img->show('/path/to/background.jpg');
  6. ?>

Next we will need one that verifies the user input with the image:

PLAIN TEXT
PHP:
  1. <?php
  2.  
  3. $flash_id = $_GET['flash_id'];
  4. $captcha_text = $_GET['captcha_text'];
  5.  
  6. if ($flash_id && $captcha_text){
  7.     $con = mysql_connect('localhost', 'DB_USERNAME', 'DB_PASSWORD');
  8.     if (!$con) {
  9.         die('Could not connect: ' . mysql_error());
  10.     }
  11.     mysql_select_db("utils", $con);
  12.     $result = mysql_query("SELECT * FROM captcha WHERE flash_id = '".$flash_id."'");
  13.     $match = 0;
  14.     $valid = 0;
  15.     $answer = "false";
  16.     while($row = mysql_fetch_array($result, MYSQL_ASSOC))
  17.     {
  18.         if($row['valid'] == 1)
  19.         {
  20.             $valid = 1;
  21.            
  22.             if($row['captcha_id'] == $captcha_text){
  23.                 $match = 1;
  24.                 $answer = "true";
  25.             }
  26.         }
  27.        
  28.     }
  29.     if($valid == 1){
  30.         mysql_query("UPDATE captcha SET valid = '0' WHERE flash_id = '".$flash_id."'");
  31.        
  32.     }
  33.     echo $answer;
  34.     mysql_close($con);
  35. }
  36. ?>

Now that we have the PHP in place we can create the Flash. The display logic is separated from the view so you can re-use this code with any server side script. The Captcha class requires an ID and a URL to the image to display. It has optional styling parameters to match the look and feel of your webpage.

Generating a Captcha in Flash:

PLAIN TEXT
Actionscript:
  1. // Create a Captcha object
  2. _captcha = new Captcha( );
  3.  
  4. // Create a unique ID so the server can identify the Flash
  5. var date:Date = new Date();
  6. var id:String = "" + Math.floor(Math.random()*1000) + date.time;
  7.  
  8. // Pass in the url along with the ID so the Captcha can load
  9. _captcha.loadCaptcha("http://www.blackcj.com/utils/securimage_show.php?flash_id=" + id, id);

Verifying a Captcha in Flash:

PLAIN TEXT
Actionscript:
  1. var loader:URLLoader = new URLLoader();
  2. loader.addEventListener(Event.COMPLETE, formSuccess, false, 0, true);
  3. var request:URLRequest = new URLRequest("http://www.blackcj.com/utils/check_captcha.php?flash_id=" + _captcha.id + "&captcha_text=" + _text.text);
  4. loader.load(request);

Flash Demo and Source:

Server Side Captcha for Flash

Get Adobe Flash player

(click the image to manually refresh the captcha)

Full source code for Flash & PHP can be found here.

In the source code you will need to replace DB_USERNAME and DB_PASSWORD with your username and password. This example also requires a MySQL database with a table called captcha containing rows flash_id, captcha_id and valid. Valid is used to ensure the Captcha is only submit one time. Since we are always generating a new image there is no reason the Captcha should be allowed to be submitted twice with the same id.

Next Steps:
Additional steps could be taken to prevent robots. Failure rates and number of attempts could be stored for each IP address. No human should ever attempt to re-submit an old Captcha since each time it is randomly generated. The system could block anyone that attempted to re-submit a Captcha.

I would eventually like to make this accessible by integrating audio support. This is a feature of Securimage and would make the utility more versatile.

]]> http://www.blackcj.com/blog/2009/11/23/adding-server-side-captcha-to-flash-forms/feed/ 7 Validate Twitter Credentials in AIR http://www.blackcj.com/blog/2008/12/21/validate-twitter-credentials-in-air/ http://www.blackcj.com/blog/2008/12/21/validate-twitter-credentials-in-air/#comments Sun, 21 Dec 2008 22:21:42 +0000 Chris Black http://www.blackcj.com/blog/?p=131 Problem:
Your AIR application needs to validate the username / password and handle failure gracefully within the application. If the user enters the wrong information you do not want them to be prompted with a windows prompt asking them to enter their Twitter username / password. If the application needs to hold on to the credentials for any reason the windows authentication to the API will break the AIR application.

"The server twitter.com at Twitter API requires a username and password."

Windows Authentication Pop-up Message.

Windows Authentication Pop up message.

Solution:
The URLRequest object has a property called 'authenticate' that must be set to false.

PLAIN TEXT
Actionscript:
  1. /**
  2. *
  3. * Setting result.authenticate to false prevents the operating system from
  4. * taking over and prompting the user to authenticate.  It allows the AIR
  5. * application to take the correct action.
  6. *
  7. */  
  8. private function twitterRequest (url : String):URLRequest
  9. {
  10.     var result:URLRequest = new URLRequest (url);
  11.     if (this.authorizationHeader){
  12.         result.authenticate = false;  // <--------- Most Important Line of Code!!!!
  13.         result.requestHeaders = [this.authorizationHeader]; 
  14.     }
  15.     return result;
  16. }

Most of the code from the example attached below is from the Google code repository:

http://code.google.com/p/twitterscript/

Here are the source files to an example AIR application that uses actionscript to verify Twitter credentials without prompting a windows box on failure:

Source Files

I would like to give credit to Clayton (file_cabinet) for coming up with the solution to this problem. Thanks Clayton!

]]> http://www.blackcj.com/blog/2008/12/21/validate-twitter-credentials-in-air/feed/ 7