Google Recaptcha 2.0 and Vaadin

Vaadin 6 / 7 / 8
1

I tying implement without success Google Recaptcha 2.0 to my Vaadin project.

I added code as google say:
@JavaScript (“”)
public class testUI extends UI {
…
layout.addComponent(new Label(“<div class="g-recaptcha" data-sitekey="my_key">”, ContentMode.HTML));
…
}
But recaptcha block is not appears. I trie this code on other (non Vaadin) site, its working good. How this should be on Vaadin?
Thanks.

2

Your @Javascript annotation is wrong.
You need (or at least should) donwload the api Js file and put it in the same folder as your testUI class. Then you can use something like:

@Javascript({"api.js"}) The { and the } is optional if you have only one JS Resource btw.

3

Sorry, annotation is @JavaScript (“https://www.google.com/recaptcha/api.js”). Now I have tried @Javascript({“api.js”}) as you say with same result. I see script in debug, but it is not performed, I think. I tried different options before without success :frowning:

4

It could be that just using a div with a special class and key as a Label doesn’t do it. Check the Vaadin wiki for writing Javascript Custom Component.
Also there is the Source code for the reCaptcha add-on which is using Version 1 still:

https://github.com/wbstr/vaadin-recaptcha

5

I have implemented Javascript Custom Component with connector and it working! Thanks!

6

Any suggestions concerning the stacktrace below?

I have recaptcha4j version 0.0.7, wcslib-vaadin-widget-recaptcha version 1.1.1. I have worked with the examples on the net for a while where the class DummyRegWithReCaptcha was not possible to use as such or extract pieces from to get a working example. The recaptcha appears to be empty cause I keep being asked to “Please fill the captcha!”.

(ALLVARLIG means serious in swedish)

I run vaadin 7.5.6, Eclipse Mars, Java 1.8 with 1.7 compliance. I want to make a contact form.

Any help greatly appreciated!
regards,
Kåre Jonsson

okt 12, 2015 11:04:10 EM com.vaadin.server.DefaultErrorHandler doDefault
ALLVARLIG:
java.lang.AbstractMethodError: com.wcs.wcslib.vaadin.widget.recaptcha.ReCaptcha$1.call(Lelemental/json/JsonArray;)V
at com.vaadin.server.JavaScriptCallbackHelper$1.call(JavaScriptCallbackHelper.java:80)
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.lang.reflect.Method.invoke(Method.java:497)
at com.vaadin.server.ServerRpcManager.applyInvocation(ServerRpcManager.java:158)
at com.vaadin.server.ServerRpcManager.applyInvocation(ServerRpcManager.java:118)

… and many more …

7

your implementation works in a window? I’ve also implemented my custom component, but it only works one time … when I close the window it does not work anymore …

8

i have implement recaptcha in my code it work fine with http but not in https it show an error your browser try to read resource from unauthrorised site

can any one face this problem tell me how to fix this

@JavaScript(“http://www.google.com/recaptcha/api/js/recaptcha_ajax.js”)

com.wcs.wcslib.vaadin.widget.recaptcha.ReCaptcha= email_Recaptcha=new ​com.wcs.wcslib.vaadin.widget.recaptcha.ReCaptcha.ReCaptcha(SECRET_KEY,SITE_KEY,new ReCaptchaOptions());

9

I do not know if he solved it but he just changes this line @JavaScript(“http://www.google.com/recaptcha/api/js/recaptcha_ajax.js”) for it and it @JavaScript(“https://www.google.com/recaptcha/api/js/recaptcha_ajax.js”) works with https