How To use BotDetect ASP.NET CAPTCHA without Visual Studio

documentation > asp.net 2.0 captcha > how to

Prerequisites

IIS 5.0+
.Net Framework 2.0
BotDetect 2.0.x for ASP.NET 2.0

Step 1. Create new ASP.NET 2.0 Web Site

Create a new folder for the website (we will use BotDetectSample in these instructions)

Create a new file named Default.aspx in the website folder, with the following content:

<%@ Page Language="C#" AutoEventWireup="true"  
  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 
  Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/
    xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>BotDetect Demo</title>
</head>
<body>
  <form id="form1" runat="server">
    <div id="PromptDiv">
      <span id="Prompt">Type the characters you see in 
        the picture</span>
    </div>
  </form>
</body>
</html>

Create a new file named Default.aspx.cs in the website folder, with the following content:

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page 
{

}

Right-click the folder and open its Properties...

...click "Share this folder" in the "Web Sharing" tab...

...and click "OK".

Open "Administrative Tools" in Control Panel...

...choose "Internet Information Services"...

...select the newly created website virtual folder in the Web Sites tree view...

...right-click the folder and open its Properties...

...click "Edit" on the "Directory Security" tab...

...check the "Anonymous access" check box and click "OK"...

...switch to the "ASP.NET" tab and make sure the correct runtime version is selected (2.0.50727); click "Apply" to change it if needed...

...close the Properties dialog, right-click the Default.aspx file in the folder view, and select "Browse"...

...and if everything is configured correctly, you should see the page in your browser

[back to top]

Step 2. Configure your site to use BotDetect CAPTCHA

Create a sub folder named Bin in the website folder

Browse to the Lanap.BotDetect.dll file located in the BotDetect CAPTCHA installation folder

Copy it to the project's Bin folder

Create a new file named Web.config in the website folder, with the following content:

<?xml version="1.0"?>
<configuration>
  <appSettings/>
  <connectionStrings/>
  <system.web>
    <httpHandlers>
      <add verb="*" path="LanapCaptcha.aspx" 
        type="Lanap.BotDetect.CaptchaHandler, 
        Lanap.BotDetect"/>
    </httpHandlers>
		
    <sessionState mode="InProc" cookieless="AutoDetect" 
      timeout="20" sessionIDManagerType="
        Lanap.BotDetect.Persistence.CustomSessionIDManager, 
        Lanap.BotDetect" />
    
    <!-- 
    Set compilation debug="true" to insert debugging 
    symbols into the compiled page. Because this 
    affects performance, set this value to true only 
    during development.
    -->
    <compilation debug="false">
      <assemblies>
       <add assembly="System.Design, Version=2.0.0.0, 
         Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
      </assemblies>
    </compilation>
    
    <!--
    The <authentication> section enables configuration 
    of the security authentication mode used by 
    ASP.NET to identify an incoming user. 
    -->
    <authentication mode="None"/>
  </system.web>
</configuration>

[back to top]

Step 3. Add a BotDetect CAPTCHA control to the page

Add the following line to the top of the Default.aspx file, just below the <%@Page %> directive:

<%@ Register Assembly="Lanap.BotDetect" 
  Namespace="Lanap.BotDetect" TagPrefix="BotDetect" %>

In the same file, add the following code fragment to the form:

<div id="CaptchaDiv">
  <BotDetect:Captcha ID="SampleCaptcha" runat="server" />
</div>

Save all changes, and refresh the page in the browser. You will see a CAPTCHA image rendered on your web form.

[back to top]

Step 4. Add user input validation logic

In the Default.aspx file, add the following code fragment to the form:

<div id="ValidationDiv">
  <asp:TextBox ID="CodeTextBox" runat="server">
  </asp:TextBox>
  <asp:Button ID="ValidateButton" runat="server" 
    Text="Validate" />
  <asp:Label ID="MessageCorrectLabel" runat="server">
  </asp:Label>
  <asp:Label ID="MessageIncorrectLabel" runat="server">
  </asp:Label>
</div>

In the Default.aspx.cs file, add the following code fragment to the class definition:

protected void Page_PreRender(object sender, EventArgs e)
{
  /// initial page setup
  if (!IsPostBack)
  {
    /// set control text
    ValidateButton.Text = "Validate";
    MessageCorrectLabel.Text = "Correct!";
    MessageIncorrectLabel.Text = "Incorrect!";

    /// these messages are shown only after validation
    MessageCorrectLabel.Visible = false;
    MessageIncorrectLabel.Visible = false;
  }
	
  if (IsPostBack)
  {
    /// validate the input code, and show the appropriate 
    /// message 
    string code = CodeTextBox.Text.Trim().ToUpper();
	
    if (SampleCaptcha.Validate(code))
    {
      MessageCorrectLabel.Visible = true;
      MessageIncorrectLabel.Visible = false;
    }
    else
    {
      MessageCorrectLabel.Visible = false;
      MessageIncorrectLabel.Visible = true;
    }

    CodeTextBox.Text = null;
  }
}

Save all changes, and refresh the page in the browser. You can then try CAPTCHA validation in action

On production web sites you will typically change the validation code to redirect the user to the resource requested if CAPTCHA validation succeeds

[back to top]

Sample BotDetect CAPTCHA project source code

You can find the full source code similar to the result you should get when following these instructions in the sample project coming with the BotDetect CAPTCHA installation.

[back to top]

Print