Project Description
The solution contains a .NET user control, web part, and custom SPField for SharePoint 2010. Allows reCaptcha to be quickly and easily integrated into OOB and custom pages along with any content type or list-related form.

Overview

What is a CAPTCHA?

From Wikipedia: “A CAPTCHA is a type of challenge-response test used in computing as an attempt to ensure that the response is generated by a person. The process usually involves one computer (a server) asking a user to complete a simple test which the computer is able to generate and grade. Because other computers are supposedly unable to solve the CAPTCHA, any user entering a correct solution is presumed to be human. Thus, it is sometimes described as a reverse Turing test, because it is administered by a machine and targeted to a human, in contrast to the standard Turing test that is typically administered by a human and targeted to a machine. A common type of CAPTCHA requires the user to type letters or digits from a distorted image that appears on the screen”.

 

CAPTCHA It is an acronym based on the word "capture" and standing for "Completely Automated Public Turing test to tell Computers and Humans Apart".

   

For more information go to: http://en.wikipedia.org/wiki/CAPTCHA

 

What is reCAPTCHA?

reCAPTCHA is a free CAPTCHA service that helps to digitize books, newspapers and old time radio shows

   

For more information go to: http://www.google.com/recaptcha/learnmore

 

 reCAPTCHA for SharePoint

The reCAPTCHA for SharePoint solution takes what the reCAPTCHA service natively provides web site administrators and developers and makes it quickly and easily consumable within SharePoint.  The solution provides the following capabilities:

·        A .NET User Control that can be added to custom application pages or dialogs via Visual Studio.

·        A Web Part that can be added to existing pages via the browser, SharePoint Designer, or Visual Studio.

·        A custom SharePoint Field (SPField) that can be added to existing or new content types and lists.

The following sections will cover installing, configuring, and using this solution in your SharePoint environment.

Installing and Activating the Solution

 

At some point in the near future I will come up with a nice little installer applet for deploying my SharePoint solutions, but for now you’ll have to do it the “hard way”.

 

1.       Save reCAPTCHA for SharePoint.wsp to a location on your SharePoint server.

2.       Go to Start > All Programs > Microsoft SharePoint 2010 Products and click the SharePoint 2010 Management Shell link.

3.       Type in the following command to add the Solution to SharePoint (…changing the path to represent where you saved the .WSP file in step 1):

 

Add-SPSolution -LiteralPath "c:\reCAPTCHA for SharePoint.wsp"

  

4.       Type in the following command to deploy the solution to a specific web application (replace url with the URL of your web application:

 

Install-SPSolution -Identity "reCAPTCHA for SharePoint.wsp" -GACDeployment -WebApplication http://url

 

or the following if you want to deploy to all web applications

 

Install-SPSolution -Identity "reCAPTCHA for SharePoint.wsp" -GACDeployment -AllWebApplications

 

5.       Activate the feature on the desired site collection(s) (replace url with the URL of your site collection)

 

Enable-SPFeature –identity "reCAPTCHAforSharePoint" -URL http://url

 

NOTE:  You can also activate the feature from Site Actions > Site Settings > Site collection features (under the Site Collection Administration section)

 

6.       Done. 

reCAPTCHA for SharePoint Properties

 

Property

Applies To

Details

PrivateKey

Web Part

User Control

SPField

This is the private key provided you when you sign-up for reCAPTCHA and register a domain.

 

 

 

Go to http://www.google.com/recaptcha for details.

PublicKey

Web Part

User Control

SPField

This is the public key provided you when you sign-up for reCAPTCHA and register a domain.

 

 

 

Go to http://www.google.com/recaptcha for details.

Theme

Web Part

User Control

SPField

This is the chrome the reCAPTCHA control will be rendered with.  The possible values are:

 

 

 

red (default)

white

blackglass

clean

Language

Web Part

User Control

SPField

This is the language the reCAPTCHA control will be rendered in.  The possible values are:

 

 

 

English (default)

Dutch

French

German

Portuguese

Russian

Spanish

Turkish

TriggerControlId

Web Part

User Control

This is the ID of the control that will cause the reCAPTCHA control to validate itself on postback.  If omitted, any postback of the page containing the reCaptcha control will cause the control to validate itself.

 

Using the reCAPTCHA User Control in an SharePoint Application Page

 

In this section I’ve created a simple contact/inquiry dialog that you might see in a public website.  The dialog is presented using the SharePoint 2010 dialog framework and on submission writes to a Contacts list in SharePoint.  To ensure that we’re dealing with a submission by a human and not some form of bot, we’re going to add a reCAPTCHA user control to the form.

pic1

So the first thing I need to do is register the user control on the page.  It is deployed to the 14\TEMPLATE\CONTROLTEMPLATES\SharePointable folder, so our Register tag will look something like this:

 

<%@ Register src="~/_controltemplates/SharePointable/reCAPTCHAUserControl.ascx" TagPrefix="spable" TagName="reCAPTCHA" %>

 

 

With the control registered, we can add it to the desired location in our HTML.  The PrivateKey and PublicKey properties are required.  You can optionally set the TriggerControlId property if you want validation of the reCaptcha entry to occur for a specific control’s postback event or you can omit it if you want any postback to cause validation.  In this case we’re going to set it to the id of the form’s Submit button.  I’m also going to set the Theme to white in lieu of the default red theme:

 

 

<sharepointable:reCAPTCHA runat="server" ID="reCaptchaContact" privatekey="6LezNsYSAAAAAPnZ4o0Iv-QaFDo_6shEVf2oCguN" publickey="6LezNsYSAAAAAGlpS29ZuK3yqceGMCHwUX27cWWv" theme="white" triggercontrolid="Submit"></pa:reCaptcha>

 

 

The user control implements a CustomValidator so you can check Page.IsValid on postback to ensure that the reCaptcha entry was valid.

 

void Submit_Click(object sender, EventArgs e)

{

    if (Page.IsValid)

    {

        // perform save

    }

}

 

Using the reCAPTCHA Web Part in an SharePoint Web  Part Page

 

The web part is nothing more than a wrapper around the User Control in the previous section.  That wrapper allows it to be added to a page and configured like any other web part.

 pic2

 

When the web part is first added to a page the Private and Public keys are not set so you will see the following message:

  pic3

 

Go to the web part’s menu and select Edit Web Part:

 pic4 

 

Expand the Settings section and configure the web part as you like:

 pic5

 

 Using the reCAPTCHA SPField

While the User Control and Web Part are certainly useful, neither is so seamlessly integrated with OOB SharePoint functionality like the SPField.  Once deployed and activated, you can add a property to an existing list or content type using this field type and instantly have reCAPTCHA functionality on the Add and Edit forms for that item/content type.  I found it particularly useful for blog comments, so I’ll walk you through how I set that up.

 

1.       Navigate to your Blog site.

2.       Open Site Actions and select View All Site Content

 pic6

3.       Under the Lists section select Comments 

 pic7

4.       Select the List view and then click List Settings on the ribbon bar 

 pic8

5.       Under the Columns section, click Create Column 

 pic9

6.       In the Name and Type section of the Create Column page, enter a name for your field and select reCAPTCHA for SharePoint 

 pic10

7.       In the reCAPTCHA Column Settings section of the Create Column page, enter your Public and Private keys and optionally change the default Theme (red) or Language (English). 

 pic11

8.       Click OK.

9.       Now go to a new or existing blog post and notice that the reCAPTCHA control is visible in the Comments section of the post: 

 pic12

10.   If you don’t enter the values or enter the wrong values you are prompted with an error message:

pic13 

 

That’s it.  My Blog comments now have an integrated reCAPTCHA capability without writing any code or customizing any pages or templates. 

 

In reality, you would probably want to create a reCAPTCHA Site Column and just use it in whatever content types and lists you want to prompt the user to enter it.  This way you don’t have to manage the Public and Private keys in multiple locations.  Just got to Site Actions > Site Settings > Site columns (under Galleries) and add a custom Site Column.

 

About SharePointable

I’m a 25-year information technology veteran with a primary focus on software architecture and development.  I have served in different capacities for well-known Microsoft partners K2, KnowledgeLake, and Metalogix as well as being a founder of BlueThread Technologies and now Portal Associates.

I consider myself an expert with .NET, SharePoint, and legacy ECM platforms and have applied that experience across a wide range of solution types and vertical industries.  I am considered a subject matter expert on ECM and BPM approaches and technologies and have deep knowledge of how ECM and BPM can be applied to financial services, retail, healthcare, and manufacturing organizations.

When I’m not tinkering with technology, I’m a husband, father of four children (3 boys, 1 girl), animal lover (2 dogs, 2 cats, and a turtle), and fairly normal guy.

 Check out my blog at blog.sharepointable.com

Last edited Aug 4, 2011 at 3:24 PM by SharePointable, version 11