{ Community }
  • Academy
  • Docs
  • Developers
  • Resources
    • Community Articles
    • Apigee on GitHub
    • Code Samples
    • Videos & eBooks
    • Accelerator Methodology
  • Support
  • Ask a Question
  • Spaces
    • Product Announcements
    • General
    • Edge/API Management
    • Developer Portal (Drupal-based)
    • Developer Portal (Integrated)
    • API Design
    • APIM on Istio
    • Extensions
    • Business of APIs
    • Academy/Certification
    • Analytics
    • Events
    • Hybrid
    • Integration (AWS, PCF, Etc.)
    • Microgateway
    • Monetization
    • Private Cloud Deployment
    • Insights
    • IoT Apigee Link
    • BaaS/Usergrid
    • BaaS Transition/Migration
    • Apigee-127
    • New Customers
    • Topics
    • Questions
    • Articles
    • Ideas
    • Leaderboard
    • Badges
  • Log in
  • Sign up

Get answers, ideas, and support from the Apigee Community

  • Home /
  • Developer Portal (Drupal-based) /
avatar image
6

Do you use DevPortal with the bootstrap modal forms? Want to enable recaptcha for user registration AND login?  

  • Export to PDF
Dino   created · Apr 28, 2016 at 01:03 AM · 633 Views · edited · May 16, 2016 at 10:59 PM

Do you like recaptcha? Want to enable it in your Drupal-based developer portal for both user registration and user login, WITH the modal bootstrap forms?

There’s been a longstanding bug in the Drupal recaptcha module that obstructs your joy. Happily, 6 days ago, a kind user in the Drupal community posted this patch:

https://www.drupal.org/files/issues/recaptcha-multiple-per-page-reroll-1833822-59.patch

…which eliminates the problem!

Try it out!

For those of you who are not all caught up yet.... What is ReCaptcha, you might ask?

ReCaptcha is Google's implementation of a user-friendly CAPTCHA. We all know what Captcha looks like:

or

CAPTCHA, I have come to learn, refers to "Completely Automated Public Turing Test To Tell Computers and Humans Apart", and the term CAPTCHA is trademarked by my alma mater, Carnegie Mellon University.

The way Google implements their Captcha (known as ReCaptcha) requires including a well-known Javascript module in the browser page (https://www.google.com/recaptcha/api.js). According to the doc by Google, by default that Javascript then scans the page for a form that contains a captcha placeholder element, and then inserts the Captcha iframe into the page in the appropriate spot. The recaptcha module for Drupal is just a Drupal wrapper around that simple mechanism.

The problem is that Google's JS by default only inserts a (re)captcha element in the first placeholder it finds. If you have Drupal, with the bootstrap modal forms enabled, there is one form for user registration, and one form for user login. The Google recaptcha library inserts the captcha widget only into the login form. (sad trombone)

But Google's recaptcha library is not really at fault here. The Google library was designed to solve the "add recaptcha to a single form" case, probably the 80% case, very simply. The Drupal module wasn't designed to be general enough to handle multiple modal forms. With the patch I referenced above, the Drupal module now works. Basically the Drupal module is just being smarter about how it uses the Google recaptcha JS.

Google allows an "explicit" rendering mode (See the doc link I provided above) which is appropriate when there is more than one form, and hence more than one placeholder for a captcha widget. The change is only about 10 lines of code in the recaptcha module. Whew!

The unfortunate truth though, is that this low-risk patch has not yet been accepted into the master recaptcha source.

For now, to get this goodness, you need to apply the patch yourself. To do so, I suggest you download and unpack the latest recaptcha module, into your sites/all/modules/contrib directory. Then apply the diff. (yes, I did it in emacs, so it was easy) Do a git push, and then Verify the recaptcha works on your dev server.

The result is that now you can see recaptchas in both the user login and user registration forms.

captcha-1.png (59.9 kB)
captcha-2.png (16.7 kB)
register-user.png (98.9 kB)
login-user.png (65.9 kB)
thub.nodes.view.add-new-comment
how tocaptcharecaptcha
Add comment Show 5
10 |5000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by Apigeeks only
  • Viewable by the original poster
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image williamking · Jun 23, 2016 at 09:41 PM 0
Link

How do you activate the module added to sites/all/modules/contrib, and not the module included in the apigee profile (profiles/apigee/modules/contrib)?

avatar image Anil Sagar @ Google ♦♦ williamking   · Jun 24, 2016 at 03:59 AM 0
Link

@williamking , Just navigate to "admin/modules" page and enable the module. All the modules available in portal are listed in "admin/modules" page.

avatar image williamking Anil Sagar @ Google ♦♦ · Jun 24, 2016 at 02:16 PM 0
Link

So it should list both modules for activation, and you'll know which one is the modified version and which one is the Apigee profile version? I didn't see that but I might have missed it.

Show more comments
avatar image Nat Harding · Jun 26, 2018 at 12:17 AM 0
Link

Thank you so much for posting that Dino! It helped point me to a working patch for a related issue troubling me. In my case I had ajaxified the modals but the recaptcha form was not rendering when the form was returned with user validation errors.

For those who may be having problems with ajaxifying the modals + recaptcha, if the patch that Dino kindly provided does not work for you, there is a newer patch out that might do the trick:

https://www.drupal.org/files/issues/2018-05-07/1833822-143-allow-multiple-per-page-D7.patch

If you'd like to follow the recaptcha drupal module issue queue for this bug, in case newer patches are released, you may do so here:

https://www.drupal.org/node/1833822

Article

Contributors

avatar image avatar image
Follow

Follow this article

32 People are following this .

avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image

Navigation

Do you use DevPortal with the bootstrap modal forms? Want to enable recaptcha for user registration AND login?

Related Articles

User Registration Validation in the devportal

  • Products
    • Edge - APIs
    • Insights - Big Data
    • Plans
  • Developers
    • Overview
    • Documentation
  • Resources
    • Overview
    • Blog
    • Apigee Institute
    • Academy
    • Documentation
  • Company
    • Overview
    • Press
    • Customers
    • Partners
    • Team
    • Events
    • Careers
    • Contact Us
  • Support
    • Support Overview
    • Documentation
    • Status
    • Edge Support Portal
    • Privacy Policy
    • Terms & Conditions
© 2019 Apigee Corp. All rights reserved. - Apigee Community Terms of Use - Powered by AnswerHub
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Create an article
  • Post an idea
  • Spaces
  • Product Announcements
  • General
  • Edge/API Management
  • Developer Portal (Drupal-based)
  • Developer Portal (Integrated)
  • API Design
  • APIM on Istio
  • Extensions
  • Business of APIs
  • Academy/Certification
  • Analytics
  • Events
  • Hybrid
  • Integration (AWS, PCF, Etc.)
  • Microgateway
  • Monetization
  • Private Cloud Deployment
  • Insights
  • IoT Apigee Link
  • BaaS/Usergrid
  • BaaS Transition/Migration
  • Apigee-127
  • New Customers
  • Explore
  • Topics
  • Questions
  • Articles
  • Ideas
  • Members
  • Badges