xaloon / wicket components

2009-12-04 23:31 | Author: vytautas.racelis

Sometimes you need to protect your data from spam or auto submit. Apache wicket has default implementation of captcha, but you may try something different.

Default Apache Wicket captcha implementation

This implementation is standalone. It might be used if you do not want to depend on external service providers, such as reCAPTCHA

You are responsible for everything here:

1. Generate random String which will be displayed as an image to your customer;

2. Create non caching image for this generated string:

PropertyModel<String> model = new PropertyModel<String> (this, "captcha");
CaptchaImageResource captchaImageResource = 
	new CaptchaImageResource(model.getObject());
NonCachingImage imgCaptcha = 
	new NonCachingImage("captchaImage", captchaImageResource);
				

3. BE AWARE: if you will verify your page at Markup Validation Service, you may be surprised. Image may be not valid. This is because of symbol "&" appended at the end of generated image url (This means that image is not cached). This may be solved in such way:

NonCachingImage imgCaptcha = 
	new NonCachingImage("captchaImage", captchaImageResource) {
	@Override
	protected void onComponentTag(ComponentTag tag) {
		super.onComponentTag(tag);
	
		String url = tag.getAttributes().getString("src");
		url = url.replaceAll("&", "&");
		tag.put("src", url);
	}
}
				
				

4. Ensure you are validating message you receive from post action;

5. Add AjaxFallbackLink to reload captcha image;

6. And ... reload image and input text after success/failure in order to change random string.

 

Looks very easy, right? So why do we need other captcha implementation?

reCAPTCHA implementation

reCAPTCHA provides us these features:

- No need to think how better to generate random string;

- No responsibility of image creation;

- No responsibility of text validation;

- Voice recognition feature.

reCAPTCHA provides us very easy AJAX setup, but for full Apache Wicket support it is not useful. Javascript generates input text field for us, but it is not handled by Apache Wicket. You shoud use custom reCAPTCHA design template in order to handle input text of recaptcha response field. So there are several abstract steps to implement reCAPTCHA with Apache Wicket:

1. Register at reCAPTCHA site. You will get a private and a public keys for your site;

2. I will bypass design part, cause you already saw the custom template here;

Validation

3. You should get 'recaptcha_challenge_field' string directly from request:

Request request = RequestCycle.get().getRequest();
String recaptcha_challenge_field = request.getParameter("recaptcha_challenge_field");
				
				

And 'recaptcha_response_field' is handled by your wicket RequiredTextField 3. As i said earlier, you do need to validate response field by yourself. But this field must be verified by reCAPTCHA site. Apache Commons HTTP Client may help here:

HttpClient client = new HttpClient();
PostMethod post = new PostMethod("http://api-verify.recaptcha.net/verify");
post.addParameter("privatekey", privateKey);

post.addParameter("remoteip", remoteAddress);
post.addParameter("challenge", challenge);
post.addParameter("response", response);
try {
	int code = client.executeMethod(post);
	if (code != HttpStatus.SC_OK) {
		throw new RuntimeException("Could not send request: " + post.getStatusLine());
	}
	String resp = readString(post.getResponseBodyAsStream());
	if (resp.startsWith("false")) {
		return false;
	}
} catch (Exception e) {
	log.error(e);
}

4. After validation you should reset input text field and reload reCAPTCHA image. Image may be reloaded invoking such javascript:

public void onError(AjaxRequestTarget target) {
	target.appendJavascript("Recaptcha.reload()");
}

Result you may see below :) Having some questions? Just leave a comment or contact me :)