Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: using google's recaptcha3 to perform a bot detection #62

Draft
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

Zougouda
Copy link
Contributor

@Zougouda Zougouda commented Jul 12, 2024

This one addresses the issue #17

This PR, although functional, serves more as a Proof of Concept for the robot detection on the contact form. And could be vastly improved.

Normally, the recaptcha implementation would require a back-end part. Which we do not really have because this is a static website.

But...
I noticed you were using a Google Script App to send the contact form data towards. Since i don't have access to its source, i decided to create another one using my own google account and handle the recaptcha backend part there.

Hence, i'll copy here the content of my GoogleScript hosted at this URL: https://script.google.com/macros/s/AKfycbxRKmuN_AoP_4gzvsio4L101YCcI_1n1XUWB1YMgHKqhZDSEeayxJXo7wRks24PMKhe

const secret = '6LdEaA4qAAAAAMQr1nDzvDrki-DBMDWaPOQ4nJds' // RECAPTCHA secret key

function verifyCaptcha(token){
  const payload = {
    secret,
    response: token
  };
  const url = 'https://www.google.com/recaptcha/api/siteverify';

  const resp = UrlFetchApp.fetch(url, {
    payload,
    method : 'POST'
  }).getContentText();

  return JSON.parse(resp)
}

// URL to call: <GSCRIPT_URL>/exec?token=<RECAPTCHA_TOKEN>
function doGet(e) {
  const token = e.parameter['token'];
  const data = verifyCaptcha(token);
  return ContentService.createTextOutput(JSON.stringify(data)).setMimeType(ContentService.MimeType.JSON); 
}

It's a simple app that will contact the recaptcha verify api and return the "bot probability" score along with others variables.

TODO to replicate

  • Create your own recaptcha project with pyronear's google account
  • Replace the client ID in the code (here: 6LdEaA4qAAAAACDNhU72_De3d9dNhGJ87dKyuFby). The both of them (in the .js file and in the param on script setup)
  • Create your own GoogleScript file publicly accessible and copy the content of my snippet in it (Do not forget to replace the secret key (here: 6LdEaA4qAAAAAMQr1nDzvDrki-DBMDWaPOQ4nJds) ).
  • Replace the url of the GoogleScript called in the .js (here: https://script.google.com/macros/s/AKfycbxRKmuN_AoP_4gzvsio4L101YCcI_1n1XUWB1YMgHKqhZDSEeayxJXo7wRks24PMKhe)

By simply doing this you'd have a working detection system that still could be improved:

Next steps

The ideal situation would be to have a single GoogleScript file that would check for bots AND ingest form data afterwards (if the sender is human, that is).
So the code snippet above could be addded to your existing script (https://script.google.com/macros/s/AKfycbxzvB_Jbta7xCVuz-iThqXftPb1DcBTf-P-ah4KnbxBn3OhcHJF) and stop execution earlier in case of a bot detection!

Hope it helps!

@fe51 fe51 marked this pull request as draft July 18, 2024 13:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant