Replace nobot with django-recaptcha (#19312)

* Replace nobot with django-recaptcha

* Silence system check since we'll be using the test keys locally

* Customize template to avoid inline JavaScript

requirements/prod.txt

@@ -283,6 +283,9 @@ django-multidb-router==0.10 \
 django-post-request-task==0.5 \
     --hash=sha256:26c03b5d06eb1705b2438bb719575fac4aae7f34c32837480202acad556edb3c \
     --hash=sha256:91df3893c9551851cd10568ef3b2cf358bd87e8c65dce728c37196a8de34247c
+django-recaptcha==3.0.0 \
+    --hash=sha256:1aed69fd6ac8fd9e99e52665392ae6748f8b6339ace656fad779fe0c6c915a52 \
+    --hash=sha256:253197051288923cae675d7eff91b619e3775311292a5dbaf27a8a55ffebc670
 django-statsd-mozilla==0.4.0 \
     --hash=sha256:81084f3d426f5184f0a0f1dbfe035cc26b66f041d2184559d916a228d856f0d3 \
     --hash=sha256:0d87cb63de8107279cbb748caad9aa74c6a44e7e96ccc5dbf07b89f77285a4b8
@@ -376,9 +379,6 @@ mmh3==3.0.0 \
 pymemcache==3.5.2 \
     --hash=sha256:3fca0215845d7b2ecd5f4c627fcf4ce2345a703a897b7e116380115b5a197be2 \
     --hash=sha256:8923ab59840f0d5338f1c52dba229fa835545b91c3c2f691c118e678d0fb974e
-nobot==0.7 \
-    --hash=sha256:a724b877bbb6ad2c9614a6461c86125ab950c4e8a9ce27355d39703409dedb6a \
-    --hash=sha256:12c0ad7d62ad0eb65456ba88e796a5dcb21b13d940f71f4bcb28d4f84cb0106a
 # polib is required by dennis
 polib==1.1.1 \
     --hash=sha256:d3ee85e0c6788f789353416b1612c6c92d75fe6ccfac0029711974d6abd0f86d \

settings.py

@@ -167,3 +167,8 @@ except ImportError:
     )
 
 SITEMAP_DEBUG_AVAILABLE = True
+
+# Recaptcha test keys from https://developers.google.com/recaptcha/docs/faq.
+# Will show the widget but no captcha, verification will always pass.
+RECAPTCHA_PUBLIC_KEY = '6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI'
+RECAPTCHA_PRIVATE_KEY = '6LeIxAcTAAAAAGG-vFI1TnRWxMZNFuojJ4WifJWe'

src/olympia/amo/fields.py

@@ -8,7 +8,7 @@ from django.db import models
 from django.forms import fields
 from django.utils.translation import gettext_lazy as _
 
-from nobot.fields import HumanCaptchaField
+from captcha.fields import ReCaptchaField as UpstreamReCaptchaField
 
 
 class PositiveAutoField(models.AutoField):
@@ -50,7 +50,7 @@ class HttpHttpsOnlyURLField(fields.URLField):
         ]
 
 
-class ReCaptchaField(HumanCaptchaField):
+class ReCaptchaField(UpstreamReCaptchaField):
     # Sub-class so we can translate the strings.
     default_error_messages = {
         'captcha_invalid': _('Incorrect, please try again.'),

src/olympia/devhub/templates/captcha/includes/js_v2_checkbox.html

@@ -0,0 +1 @@
+<script src="https://{{ recaptcha_domain }}/recaptcha/api.js{% if api_params %}?{{ api_params }}{% endif %}"></script>

src/olympia/lib/settings_base.py

@@ -69,6 +69,7 @@ SILENCED_SYSTEM_CHECKS = (
     # Recommendation to use OneToOneField instead of ForeignKey(unique=True)
     # but our translations are the way they are...
     'fields.W342',
+    'captcha.recaptcha_test_key_error',
 )
 
 # LESS CSS OPTIONS (Debug only).
@@ -525,7 +526,7 @@ INSTALLED_APPS = (
     'waffle',
     'django_jinja',
     'rangefilter',
-    'nobot',
+    'captcha',
     # Django contrib apps
     'django.contrib.admin',
     'django.contrib.auth',
@@ -1058,10 +1059,7 @@ CSP_FONT_SRC = (
     "'self'",
     PROD_STATIC_URL,
 )
-CSP_CHILD_SRC = (
-    'https://www.google.com/recaptcha/',
-    'https://www.recaptcha.net/recaptcha/',
-)
+CSP_CHILD_SRC = ('https://www.recaptcha.net/recaptcha/',)
 CSP_FRAME_SRC = CSP_CHILD_SRC
 CSP_IMG_SRC = (
     "'self'",
@@ -1075,7 +1073,6 @@ CSP_OBJECT_SRC = ("'none'",)
 
 CSP_SCRIPT_SRC = (
     'https://www.google-analytics.com/analytics.js',
-    'https://www.google.com/recaptcha/',
     'https://www.recaptcha.net/recaptcha/',
     'https://www.gstatic.com/recaptcha/',
     'https://www.gstatic.cn/recaptcha/',
@@ -1133,12 +1130,9 @@ FILE_UPLOAD_PERMISSIONS = 0o644
 
 # RECAPTCHA: overload the following key settings in local_settings.py
 # with your keys.
-# Old recaptcha V1
-RECAPTCHA_PUBLIC_KEY = env('RECAPTCHA_PUBLIC_KEY', default='')
-RECAPTCHA_PRIVATE_KEY = env('RECAPTCHA_PRIVATE_KEY', default='')
-# New Recaptcha V2
-NOBOT_RECAPTCHA_PUBLIC_KEY = env('NOBOT_RECAPTCHA_PUBLIC_KEY', default='')
-NOBOT_RECAPTCHA_PRIVATE_KEY = env('NOBOT_RECAPTCHA_PRIVATE_KEY', default='')
+RECAPTCHA_PUBLIC_KEY = env('NOBOT_RECAPTCHA_PUBLIC_KEY', default='')
+RECAPTCHA_PRIVATE_KEY = env('NOBOT_RECAPTCHA_PRIVATE_KEY', default='')
+RECAPTCHA_DOMAIN = 'www.recaptcha.net'
 
 # Send Django signals asynchronously on a background thread.
 ASYNC_SIGNALS = True

src/olympia/templates/captcha/widget_nocaptcha.html

@@ -1,23 +0,0 @@
-<script src='https://www.recaptcha.net/recaptcha/api.js{% if lang %}?hl={{ lang }}{% endif %}' async defer></script>
-<div class="g-recaptcha" data-sitekey="{{ public_key }}"></div>
-<noscript>
-  <div style="width: 302px; height: 484px;">
-    <div style="width: 302px; height: 424px; position: relative;">
-      <div style="width: 302px; height: 424px; position: absolute;">
-        <iframe src="https://www.recaptcha.net/recaptcha/api/fallback?k={{ public_key }}{% if lang %}&amp;hl={{ lang }}{% endif %}"
-                frameborder="0" scrolling="no"
-                style="width: 302px; height:424px; border-style: none;">
-        </iframe>
-      </div>
-    </div>
-    <div style="width: 300px; height: 60px; border-style: none;
-                bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px;
-                background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px;">
-      <textarea id="g-recaptcha-response" name="g-recaptcha-response"
-                class="g-recaptcha-response"
-                style="width: 250px; height: 40px; border: 1px solid #c1c1c1;
-                       margin: 10px 25px; padding: 0px; resize: none;" >
-      </textarea>
-    </div>
-  </div>
-</noscript>