10 Replies Latest reply: Jun 24, 2014 4:50 PM by Peta@Reliance RSS

    An alternative to using Recaptcha or Image Verification

    Simon Darby Community Member
    Simon Darby Dec 29, 2013 8:29 PM

      Some clients may not want to use ReCaptcha for some reason (like it looks awful and can be hard to read for some customers).

       

      I came up with this after getting spam using the standard BC Image Verification (which looks nice but wasn’t really working for me). The spam stopped immediately (for now) possibly because it stopped spammers pasting in an email address.

       

      How it works

       

      In this example I simply require the customer to input their email address in two parts, leaving out the @ symbol.

       

      The two parts are joined using javascript and sent to the hidden input with the ID ‘EmailAddress’.

       

      You will need to add two new text inputs to your form. You do not need to create these new input fields in the BC form builder. Just hand code them into the existing or new form. Remember this form has no Recaptcha or Image Verification (if you already have Recaptcha or Image Verification modules in your form, go back to the BC form builder and remove, then get the new HTML to work with).

       

      <!—- Form inputs —>

      <input type="text" id="EmailName" name="EmailName" maxlength="255" placeholder="john" oninput="join_email();" onpaste="join_email();" />

      <span class="add-on">@</span>

      <input type="text" id="DomainName" name="DomainName" maxlength="255" placeholder="example.com" oninput="join_email();" onpaste="join_email();" />

      <input type="hidden" name="EmailAddress" id="EmailAddress" class="cat_textbox" maxlength="255" />

       

      Note that the standard BC form input for email address has its input type changed to 'hidden'.

       

      <!-- Form function -->

      <script type="text/javascript">

      function join_email()

      {

      var EmailName = document.getElementById('EmailName').value;

      var DomainName = document.getElementById('DomainName').value;

      document.getElementById('EmailAddress').value = EmailName+'@'+DomainName;

      }

      </script>

       

      Place this script just above the standard BC form validation scripts inside the form tags.

       

      I don't expect it's full proof, but it's another option to consider.

      Working example here: http://dotsilo.com/contact.html

       

      If you want to know more about Captcha, check this out: http://forums.adobe.com/docs/DOC-2995

        • 1. Re: An alternative to using Recaptcha or Image Verification
          Lynda Spangler Community Member
          Lynda Spangler Dec 29, 2013 9:33 PM (in response to Simon Darby)

          Thank you for sharing!

           

          I wonder if this would work for blog post comments?

           

          I don't have a problem with web forms but the blog post are an issue for me. My client HATES the "hard" captcha and the "easy" captcha is worthless for spam prevention.

          • 2. Re: An alternative to using Recaptcha or Image Verification
            Simon Darby Community Member
            Simon Darby Jan 12, 2014 1:13 PM (in response to Simon Darby)

            Just an update on how this is working out. The code has been in place a month now and not a single peice of SPAM has been recieved.

             

            This should work with any form on a BC site, including blog posts where an email address is required.

             

            Here's an idea for the BC development team, add this feature to 'web forms', but have the assembly of the email address occur server-side to avoid bots.

            • 3. Re: An alternative to using Recaptcha or Image Verification
              Liam Dilley CommunityMVP
              Liam Dilley Jan 12, 2014 3:10 PM (in response to Simon Darby)

              More complicated to use I feel that, that can have a variety of errors and not get the correct information through, Not a fan

              No spam but you will likely find less conversion from that.

               

              If you want no spam and no captcha. Have your web form and only have the form action in a data tag (html5) and then on completion of the form and submit the form process actions that action in.

              No form action, no bot can fill it in and submit and no modification to how your form looks or operates.

              • 4. Re: An alternative to using Recaptcha or Image Verification
                Simon Darby Community Member
                Simon Darby Jan 12, 2014 7:24 PM (in response to Liam Dilley)

                Hey Liam

                 

                That sounds very cool, and may be a way better solution! Got an example of that I can look at? Thanks.

                 

                P.S. I have not encountered any errors so far in running this script or form. Pretty much getting same number of real enquiries coming through, so all good this end .

                • 5. Re: An alternative to using Recaptcha or Image Verification
                  Lynda Spangler Community Member
                  Lynda Spangler Jan 12, 2014 11:13 PM (in response to Liam Dilley)

                  I tried Liam's method. I will be interested to see if it stops all or most of the spam. I implemented the idea on blog comments. I am unsure if this is the exact way Liam had in mind but is my version. I welcome all feedback on how to improve it:

                   

                  Here is the script and form code:

                  <!-- First change form code. Add class, data-action, and empty action -->

                   

                  <form class="data-submit" action="" data-action="/RatingProcess.aspx?OID={tag_blogpostid}&amp;OTYPE={tag_blogposttype}" onsubmit="return checkWholeForm12345(this)" name="catratingform12345" method="post">

                   

                  <!-- Contents of form here -->

                   

                  <script type="text/javascript" src="/CatalystScripts/ValidationFunctions.js"></script>

                  <!-- Script to swap out action - I inserted this right above the BC JS for the form-->

                  <script type="text/javascript">

                          function SwapAction() {

                              var dataAttr = $('.data-submit').data();

                              $('.data-submit')[0].action = dataAttr.action;

                          }

                  </script>

                  <!-- I call the function SwapAction in this JS. Find theForm.submit(); and add SwapAction(); right before it. Example below. -->

                  <script type="text/javascript">

                  //<![CDATA[

                  function checkWholeForm12345(theForm){var why = "";if (theForm.EmailAddress) if (theForm.EmailAddress.value.length > 0) why += checkEmail(theForm.EmailAddress.value);if (theForm.CaptchaV2) why += captchaIsInvalid(theForm, "Enter Word Verification in box below", "Please enter the correct Word Verification as seen in the image"); if (why != ""){alert(why);return false;}SwapAction();theForm.submit();return false;}

                  //]]>

                  </script>

                  </form>

                   

                  I will monitor the results of this and report back. The blog I added this to receives 50+ spam comments a day as the "easy" captcha does nothing. My client hates the hard captcha as it is too difficult to read and reCatpcha cannot be added to blog post yet. Hopefully this will help eliminate a lot of spam.

                  • 6. Re: An alternative to using Recaptcha or Image Verification
                    Lynda Spangler Community Member
                    Lynda Spangler Jan 20, 2014 9:06 PM (in response to Lynda Spangler)

                    As an update this works great. It took blog comment from 50+ a day to zero. I then had an increase in forum spam and I implement this method on the forum registration form and again it went to zero.

                    • 7. Re: An alternative to using Recaptcha or Image Verification
                      Liam Dilley CommunityMVP
                      Liam Dilley Jan 21, 2014 2:02 AM (in response to Lynda Spangler)

                      Sorry to boast but I am a genious

                      • 8. Re: An alternative to using Recaptcha or Image Verification
                        Simon Darby Community Member
                        Simon Darby Jan 21, 2014 12:08 PM (in response to Lynda Spangler)

                        Thanks for sharing the example code Lynda! Perhaps BC could amend its own default form code to use this idea of Liam's.

                        • 9. Re: An alternative to using Recaptcha or Image Verification
                          Liam Dilley CommunityMVP
                          Liam Dilley Jan 21, 2014 1:16 PM (in response to Simon Darby)

                          I would not really as you create a condition that BC forms ship not working out the box unless you have javascript running, not to keen on that.

                          • 10. Re: An alternative to using Recaptcha or Image Verification
                            Peta@Reliance Community Member
                            Peta@Reliance Jun 24, 2014 4:50 PM (in response to Simon Darby)

                            Hi Simon, Liam and Lynda,

                             

                            I just wanted to let you know that I implemented Lynda's code on a clients contact form and they have gone from 50+ spam enquiries a day to zero! I'm absolutely ecstatic with this solution, I just wish I'd stumbled across this a couple of months ago. But better late than never.

                             

                            Thankyou thankyou thankyou!

                            You are all genius' x