hackforla / website

Hack for LA's website
https://www.hackforla.org
GNU General Public License v2.0
323 stars 772 forks source link

CAPTCHA on Contact Us form #13

Closed thekaveman closed 4 years ago

thekaveman commented 5 years ago

From @joshuazrobins:

not that this is a big deal, but can our contact form incorporate some sort of CAPTCHA system? while i enjoy getting contact form submissions to my inbox.. i’m afraid with so many bots coming through we might actually miss a real person’s submission

joshuazrobins commented 5 years ago

https://www.google.com/recaptcha/intro/v3.html

When you get to the point of needing a Site Key and Secret Key, let me know. I can get that for you from our HFLA domain.

joshuazrobins commented 5 years ago

Instructions too 😄 All you'll need is the 2 keys, which I can provide at the time of request!

image

thekaveman commented 5 years ago

Man you're like 80% of the way there... implement the feature!

ExperimentsInHonesty commented 5 years ago

Wrote to Josh to ask him about keys

brandonjturner commented 5 years ago

reCAPTCHA v3 returns a score for each request without user friction. The score is based on interactions with your site and enables you to take appropriate action.

If we can get reCAPTCHA v3 site keys for the domain we can have an invisible CAPTCHA check setup with a few lines of code inserted to the _includes/head.html. This will require no user interaction.

We can add an additional secondary check on the submit button if we think it is required with Google's reCAPTCHA v2, that is 2 lines of HTML to render.

https://developers.google.com/recaptcha/docs/versions https://developers.google.com/recaptcha/docs/v3 https://developers.google.com/recaptcha/docs/display

joshuazrobins commented 5 years ago

reCAPTCHA v3 returns a score for each request without user friction. The score is based on interactions with your site and enables you to take appropriate action.

If we can get reCAPTCHA v3 site keys for the domain we can have an invisible CAPTCHA check setup with a few lines of code inserted to the _includes/head.html. This will require no user interaction.

We can add an additional secondary check on the submit button if we think it is required with Google's reCAPTCHA v2, that is 2 lines of HTML to render.

https://developers.google.com/recaptcha/docs/versions https://developers.google.com/recaptcha/docs/v3 https://developers.google.com/recaptcha/docs/display

If you wanted to take this on, I've got the keys needed to get it implemented.

brandonjturner commented 5 years ago

@joshuazrobins I would like to take this on. Just to confirm these keys you generated are the ones you refer to in Nov 2018 post. Are they the same since we moved the site to gh-pages and had a redesign? Would you need to regenerate? If they are good still I am ready to take this on.

joshuazrobins commented 5 years ago

@joshuazrobins I would like to take this on. Just to confirm these keys you generated are the ones you refer to in Nov 2018 post. Are they the same since we moved the site to gh-pages and had a redesign? Would you need to regenerate? If they are good still I am ready to take this on.

Yep I'll send you those keys via Slack. We created a site in the Google reCAPTCHA Admin Console, so we could track it and everything... so it shouldn't need updating.

brandonjturner commented 5 years ago

To implement reCAPTCHA on our static GitHub pages configuration we need a cloud service to handle the server side scripting. IBM Cloud Services or Amazon Web Services are examples that work with reCAPTCHAv3. Do we have an H4LA account with either of those services?

ExperimentsInHonesty commented 5 years ago

@brandonjturner - Is there a captcha that doesn't require us to have cloud service to handle the server side scripting?

brandonjturner commented 5 years ago

@ExperimentsInHonesty I can't find a foolproof client-side only solution.

ExperimentsInHonesty commented 5 years ago

@brandonjturner -I had a conversation with @thekaveman last Monday and he said he would setup the cloud service we need. We will move this ticket back when Kegan has set that up.

thekaveman commented 5 years ago

I'm kind of annoyed that we need to setup a back-end service just to do this, and especially if it's just for Google's AI to suck up more user data and make decisions for us anyway.

What if we started simple with a hidden input that normal users won't fill out, and we block submissions that have a value in that field (i.e. the "honeypot" approach)? This may inadvertently block some users that have form auto-fill turned on, and it isn't as locked-down as more advanced techniques... but it is better than nothing and doesn't require a ton of setup.

ExperimentsInHonesty commented 5 years ago

@thekaveman I am concerned that this might make the less navigatable for people that use screen readers. Thoughts?

thekaveman commented 5 years ago

@ExperimentsInHonesty that is a valid concern - a honeypot input would appear as a standard form input to a screen reader, and if filled in, could prevent that user from submitting the form. The site itself shouldn't be any less navigable beyond that, though.

As usual there's a trade-off: do we get so much spam that we absolutely need something in place ASAP, even if just temporary? Or is spam not so much of a concern where we don't want to put something in place that would inadvertently block a valid user from submitting?

ExperimentsInHonesty commented 5 years ago

Now that github actions has been publicly announced we can use the secret keeping function to hide the keys using environment variables. My understanding is that we won't need a cloud service to do this. What do you you think @brandonjturner.

ExperimentsInHonesty commented 4 years ago

@wes are we getting junk emails to Action Network via this form. If no, I will close this issue, if yes, reinvestigate it. LMK Screen Shot 2020-05-31 at 7 48 00 PM

wesrowe commented 4 years ago

@ExperimentsInHonesty We don't have any way of sorting "good" email subscribers from bad. But the original CAPTCHA issue was for Contact Us, which had a text-entry field and therefore was more spammable... But given that no one can remember ever getting an email from Contact Us, and we think it never worked right, I don't know why this captcha issue was created in the first place. So with that context -- i would say close the issue, we don't have a problem that captcha can solve.