Howto add reCAPTCHA to Create Account on CustomerLogin

Dont create your support topics here! No new topics with questions allowed!

Moderator: crythias

Forum rules
Dont create your support topics here! No new topics with questions allowed!
Post Reply
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

Here's the recipe to add reCAPTCHA to the create account sign-in of OTRS 2.4.7, though the concepts should still apply to 3.0 (not tested, but if you follow this, you'll understand that it's not that hard.)

Part 0: get a key set https://www.google.com/recaptcha/admin/create
Part 1: install reCAPTCHA

Code: Select all

cpan Captcha::reCAPTCHA
(if you're on Windows, you may have to use a different method to install)

Part 2: add to CustomerLogin.dtl (hopefully in your own theme). Additional lines are shown for position purposes

Code: Select all

#            <tr>
#              <td>$Text{"CustomerID"}: </td>
#              <td> <input type="text" name="CustomerID" value="$QData{"UserCustomerID"}" size="25" maxlength="50"/></td>
#            </tr>
# begin recaptcha
            <tr>
               <td>&nbsp;</td>
               <td>$Data{"reCAPTCHA"}</td>
            </tr>
#end recaptcha
          </table>
          <input class="button" type="submit" value="$Text{"Create"}"/> 

Part 3: modify Kernel/Output/HTML/Layout.pm (after backing it up) to show the code
in the top where the use section is, add

Code: Select all

use Captcha::reCAPTCHA; 
near the line 3897 the lines to add the recaptcha $Param below.

Code: Select all

    if (
        $Self->{ConfigObject}->Get('CustomerPanelCreateAccount')
        && $Self->{ConfigObject}->Get('Customer::AuthModule') eq
        'Kernel::System::CustomerAuth::DB'
        )
    {
        #begin recaptcha
        my $rc = Captcha::reCAPTCHA->new;
        my $rccustom = "<script type= \"text/javascript\">\n
var RecaptchaOptions = {\n
   lang : 'en',
};\n
</script>\n";
        $Param{reCAPTCHA} = $rccustom . $rc->get_html("your_recaptcha_public_key");
        #end recaptcha
        $Self->Block(
            Name => 'CreateAccount',
            Data => \%Param,
        );
    } 
Part 4: Modify Kernel/System/Web/InterfaceCustomer.pm (after backing it up) to check valid input
near the top of the file where the use lines are, again add:

Code: Select all

use Captcha::reCAPTCHA; 
Then add this near line 569 (additional lines shown for placement purposes):

Code: Select all

        # check needed params
        if ( !$GetParams{UserCustomerID} ) {
            $GetParams{UserCustomerID} = $GetParams{UserEmail};
        }
        if ( !$GetParams{UserLogin} ) {
            $GetParams{UserLogin} = $GetParams{UserEmail};
        }
        # check reCAPTCHA
        my $rc = Captcha::reCAPTCHA->new;
        my $challenge = $Self->{ParamObject}->GetParam( Param => 'recaptcha_challenge_field' )  || '';
        my $response = $Self->{ParamObject}->GetParam( Param => 'recaptcha_response_field' )  || '';
        my $result = $rc->check_answer("your_private_recaptcha_key", $ENV{'REMOTE_ADDR'},
           $challenge, $response
           );
        if ( !$result->{is_valid} ) {
            my $Output = $Self->{LayoutObject}->CustomerHeader( Area => 'Core', Title => 'Error' );
            $Output .= $Self->{LayoutObject}->CustomerWarning(
                Message => 'reCAPTCHA entry failed.',
                Comment => 'Please press Back and try again.'
            );
            $Output .= $Self->{LayoutObject}->CustomerFooter();
            $Self->{LayoutObject}->Print( Output => \$Output );
            exit 0;
        }
        #end recaptcha   
I really would love to hear *any* feedback if anyone implements it.

Edit: Added the customization javascript to the Layout.pm so anyone can change the language that the reCAPTCHA shows. The following languages are supported:
Language Code
English en
Dutch nl
French fr
German de
Portuguese pt
Russian ru
Spanish es
Turkish tr

http://code.google.com/apis/recaptcha/d ... .html#i18n
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
vaishali_dolas
Znuny newbie
Posts: 17
Joined: 13 Sep 2010, 13:03
Znuny Version: 2.4.7
Location: India,Pune

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by vaishali_dolas »

Your solution work at my end... :)
Last edited by vaishali_dolas on 07 Oct 2010, 07:10, edited 2 times in total.
Andre Bauer
Znuny guru
Posts: 2189
Joined: 08 Dec 2005, 17:01
Znuny Version: 5.0.x
Real Name: André Bauer
Company: Magix Software GmbH
Location: Dresden
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by Andre Bauer »

Did one of you submited this as patch to the otrs bugtracker?

Would be nice to see this as a regular feature...
Prod: Ubuntu Server 16.04 / Zammad 1.2

DO NOT PM ME WITH OTRS RELATED QUESTIONS! ASK IN THE FORUMS!

OtterHub.org
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

Michiel updated the bug tracker to link to here. However, while the code samples listed here *work*, they aren't very friendly to customize -- at least, mine isn't. It needs to be more "SysConfig-ified".
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
otrswannabe1
Znuny newbie
Posts: 20
Joined: 07 May 2010, 11:52
Znuny Version: 2.4.7

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by otrswannabe1 »

Hello crythias.

I want to let you know that I really like this!

Thanks so very much!

P.S. This is a must-have feature for OTRS.
newb
Znuny newbie
Posts: 8
Joined: 19 Apr 2012, 23:28
Znuny Version: 3.0.11

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by newb »

This is a very helpfull topic!

Can anyone help me implement this at the customer login page and not at registration?
I need some help with the number of the lines that I have to add code on part 3 and maybe on 4.
kevinpattison
Znuny newbie
Posts: 32
Joined: 22 Sep 2011, 16:32
Znuny Version: 5.0.16
Real Name: Kevin Pattison

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by kevinpattison »

This pretty much worked for me also on 3.0.10.

I don't run cpan, so in Ubnutu I also ran:

Code: Select all

apt-get install libcaptcha-recaptcha-perl
I had to also change all instances of "260px" to "400px" in var/httpd/htdocs/skins/Customer/default/css/Core.Login.css for it to display properly without getting cut off.

It doesn't show up in Chrome though. Not sure why.
kevinpattison
Znuny newbie
Posts: 32
Joined: 22 Sep 2011, 16:32
Znuny Version: 5.0.16
Real Name: Kevin Pattison

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by kevinpattison »

I also had to change all nistalnces of "$Self->{LayoutObject}" with "$LayoutObject" in InterfaceCustomer.pm
kevinpattison
Znuny newbie
Posts: 32
Joined: 22 Sep 2011, 16:32
Znuny Version: 5.0.16
Real Name: Kevin Pattison

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by kevinpattison »

Actually, now I am intermittently getting Perl errors that say:

Code: Select all

Software error:

Can't locate object method "new" via package "Kernel::Output::HTML::Layout" at /opt/otrs//Kernel/System/Web/InterfaceAgent.pm line 775.
For help, please send mail to the webmaster (webmaster@localhost), giving this error message and the time and date of the error.
The line changes though and these seem to happen randomly. Refeshing the page usually loads fine. All the lines being referred to invoke:

Code: Select all

my $LayoutObject = Kernel::Output::HTML::Layout->new
Any idea what would be causing this?
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

You should open a topic in help and link to here as reference. (I don't want to keep approving back-n-forth for help requests).
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

I'm working on a 3.1.x implementation.

Most of it is how Kevin says.
Kernel/System/Web/InterfaceCustomer.pm changes for 3.x

Code: Select all

         # begin check reCAPTCHA
         my $rc = Captcha::reCAPTCHA->new;
         my $challenge = $Self->{ParamObject}->GetParam( Param => 'recaptcha_challenge_field') || '';
         my $response = $Self->{ParamObject}->GetParam( Param => 'recaptcha_response_field' ) || '';
         my $result = $rc->check_answer("your_private_recaptcha_key", $ENV{'REMOTE_ADDR'}, $challenge, $response );
         if (!$result->{is_valid} ) {
            my $Output = $LayoutObject->CustomerHeader( Area => 'Core', Title => 'Error' );
            $Output .= $LayoutObject->CustomerWarning(
               Message => 'reCAPTCHA entry failed.',
               Comment => 'Please try again.'
            );
            $Output .= '<a href="javascript:location.reload(true)">Click to refresh</a>';
            $Output .= $LayoutObject->CustomerFooter();
            $LayoutObject->Print (Output => \$Output );
            exit 0;
         }
         # end check reCAPTCHA
There's probably a nicer way to try again, but this is more or less what I have at the moment.
Edit: modified for the colon after javascript per post below.
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
brianm
Znuny newbie
Posts: 3
Joined: 30 Aug 2012, 21:06
Znuny Version: 3.1.9

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by brianm »

Just a small note.

I believe the code from crythias above:

Code: Select all

..
$Output .= '<a href="javascript.location.reload(true)">Click to refresh</a>';
..
should have been

Code: Select all

..
$Output .= '<a href="javascript:location.reload(true)">Click to refresh</a>';
..

(the character after "javascript" must be a colon)

This makes it work, but not the way I wanted to so I changed it to:

Code: Select all

..
$Output .= '<a href="<your-URL-prefix-here>/customer.pl">Click here to start again.</a>';
..
This of course is a matter of taste. By calling "customer.pl" I force the user to start all over from beginning which may be cumbersome but is guaranteed to work.
brianm
Znuny newbie
Posts: 3
Joined: 30 Aug 2012, 21:06
Znuny Version: 3.1.9

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by brianm »

Just wanted to add some view points on CAPTCHAs in general.

I've read somewhere that they keep not only computers (spam bots) out but also 25% of all humans that just cannot read the text.

Google's reCAPTCHA is an excellent idea. By guessing the word your users are actually helping Google digitize old books. How does that work? Well one of the two words the user is presented with is actually a scanned word from a book where the OCR scanner has given up. Humans then (by filling in the captcha) assist Goggle in find the right spelling for those hard to read words. Personally I feel that the puzzle to solve on sites that use Google's reCAPTCHA has gotten more difficult over the past year or so. I have nothing to back that up. Just a hunch. If you think about it, it makes sense. All the easy OCR problems are now solved and the ones Google are circulating now are the really hard ones.

All in all I find that Google's reCAPTCHA is a particular nasty one. I often have to click my way trough perhaps 10 images before there's one I can solve. How many of your users would do that?
(your mileage may vary)

Anyway I hope I have time some day to post something here about the integration of other CAPTCHA solutions into OTRS customer frontend ... or perhaps even better: alternatives to CAPTCHAs, such as math questions, trivia questions, etc.

Brian
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

brianm has valid points, expanded here.
For all that I've seen, in my opinion, a time based registration (shorter than, say, 5 seconds is impossible for humans) is a better option.
How to do it? Roughly the same process:

1) inject a hidden field holding a datetimestamp or (better) an obfuscated datetimestamp -- like rot13 or something -- upon generation of the create form.
2) in processing, check (server-side) now() versus the [un obfuscated] datetimestamp and reject if the time to take is less than threshold.

Certainly it's not perfect and I'd throw in a randomization of a second or two plus or minus ...

But as long as the bots are reasonably stupid and automated, they shouldn't want to take 5 seconds to fill a form.
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
newProgrammer
Znuny newbie
Posts: 1
Joined: 25 Feb 2013, 06:17
Znuny Version: 3.1.2

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by newProgrammer »

I have to add the captcha function into index.pl..is it possible..??
Because I have to add the captcha for the login page.
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

newProgrammer wrote:I have to add the captcha function into index.pl..is it possible..??
Because I have to add the captcha for the login page.
No. Unless you're having problems where you're being hacked for automatic retries of admin logins (you may want to look at fail2ban), there is no reason to have CAPTCHA on a place where the logins must be previously established and can not be self-added from unauthenticated login.

Or, of course, the answer is yes, but also, "what's the point?"
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
ferdieb
Znuny newbie
Posts: 3
Joined: 23 Jan 2014, 09:19
Znuny Version: 3.3.3
Real Name: Ferdie
Company: HISP

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by ferdieb »

I'm using otrs 3.3.3 - can the code be updated to fit it as I don't see all the code presented in the examples? I really need this functionality...

Many thanks in advance.
crythias
Moderator
Posts: 10169
Joined: 04 May 2010, 18:38
Znuny Version: 5.0.x
Location: SouthWest Florida, USA
Contact:

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by crythias »

For Part 2, see the response to Kevin above.

Part 3 is pretty much the same... add in recaptcha part

Part 4 again, the same, add around line 637

If it doesn't work, please create a topic in the forums about what you've tried, how far you've progressed, what error message you get, etc. Note that, even though line numbers may have changed, the gist of the installation has not. If you find analogous locations for code, it'll still work there.
OTRS 6.0.x (private/testing/public) on Linux with MySQL database.
Please edit your signature to include your OTRS version, Operating System, and database type.
Click Subscribe Topic below to get notifications. Consider amending your topic title to include [SOLVED] if it is so.
Need help? Before you ask
griffin
Znuny newbie
Posts: 20
Joined: 29 Apr 2015, 19:51
Znuny Version: 3.3.8
Real Name: Marcos

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by griffin »

I know this is an old topic.

But i will post the solution for OTRS 4 if any1 needs it.


In CustomerLogin.tt add the following text:

Code: Select all

					<!-- begin recaptcha -->
						<tr>
						   <td>&nbsp;</td>
						   <td>[% Data.reCAPTCHA %]</td>
						</tr>
					<!-- end recaptcha -->
					
In Layout.pm add use Captcha::reCAPTCHA; in the use section

and in line 3274 add the following text:

Code: Select all

#begin recaptcha
			my $rc = Captcha::reCAPTCHA->new;
			my $rccustom = "<script type= \"text/javascript\">\n
				var RecaptchaOptions = {\n
				   lang : 'en',
				};\n
				</script>\n";
			$Param{reCAPTCHA} = $rccustom . $rc->get_html("public_key");
			#end recaptcha
in InterfaceCustomer.pm add the same text mentioned in original post and in the beggining use Captcha::reCAPTCHA;

Code: Select all

				# check reCAPTCHA
        my $rc = Captcha::reCAPTCHA->new;
        my $challenge = $Self->{ParamObject}->GetParam( Param => 'recaptcha_challenge_field' )  || '';
        my $response = $Self->{ParamObject}->GetParam( Param => 'recaptcha_response_field' )  || '';
        my $result = $rc->check_answer("private", $ENV{'REMOTE_ADDR'},
           $challenge, $response
           );
        if ( !$result->{is_valid} ) {
			$LayoutObject->Print(
                Output => \$LayoutObject->CustomerLogin(
                    Title => 'Login',
                    Message =>
                        $LayoutObject->{LanguageObject}
                        ->Translate('reCAPTCHA entry failed. Please press Back and try again.'),
                ),
            );		
            exit 0;
        }
        #end recaptcha

        
In the skin section (could be useful) Core.Login.css modify #Login and #Slider height attribute into a larger number so as to show the bottom of the form.

Hope this helps and sorry for the resurrection but giving back to the community in an orderly fashion.


#UPDATE: added a correction to the output. Hadn´t tried it if it failed
OTRS: 4.0.8
Database: MySQL
And1
Znuny newbie
Posts: 12
Joined: 30 Mar 2016, 16:06
Znuny Version: 5.0.7

Re: Howto add reCAPTCHA to Create Account on CustomerLogin

Post by And1 »

Hi,

I also try to implement the captcha into OTRS 5. The captcha was shown but if I click on create I receive an error message.

Fehlermeldung:
Can't call method "GetParam" on an undefined value at /opt/otrs/Kernel/System/Web/InterfaceCustomer.pm line 798. ,

This is Line 798
my $challenge = $Self->{ParamObject}->GetParam( Param => 'recaptcha_challenge_field' ) || '';

Hope somebody can help me
Post Reply