How do I stop bots from using .submit() to bypass my 'required' fields?

Question

I have a form which is producing a lot of spam. I have made all inputs required and have attached a captcha. This has not had any affect.

I assume the bots are using form.submit() as for some reason this bypasses all my required fields AND also bypasses my onsubmit="check(e)"

I cannot seem to grab this event .submit() by any means. Does anyone know how to catch this event and make sure it is cancelled. I want the only way to submit the form is through clicking the submit button.

$("#myForm").submit(function(event) {
    console.log("Handler for .submit() called.");

    if (CaptchaInput.value == "") {
        event.preventDefault();
    }
});

My code that was supposed to catch a .submit() call and prevent the form submission. This function is never triggered.

<form target="hidden_iframe" 
onsubmit="if (CaptchaInput.value == '') { why += '- Please Enter CAPTCHA Code.\n'; alert(why); return false; };return checkform(this)" id="myForm">

Verify the submission on the server, not the client, you can never trust anything done on the client — CertainPerformance, Sep 05 '19 at 08:07

score 3 · Answer 1 · answered Sep 08 '19 at 09:06

3

You cannot. I can submit your form without a browser, or with JavaScript disabled. Anyone can just send an HTTP POST request to your server, without going through any client-side process you may introduce.

The solution to your problem is to also verify on the server, and don't rely on the client side validation to have completed successfully (or indeed, even to have been run at all).

Treat client-side validation as a convenience to your users, they see the error immediately without having to retype and resubmit the entire form.

answered Sep 08 '19 at 09:06

Madara's Ghost

172,118
50
264
308

Can you possibly also give the overall idea to implement the server side verification ? – avia Oct 27 '20 at 21:15
1

ReCaptcha and other captcha solutions have a server-side to them. The implementation is specific per solution, but it's usually well documented. – Madara's Ghost Oct 28 '20 at 21:26

Cosmin Staicu · Answer 2 · 2019-09-05T09:24:07.310

-1

You can define the onsubmit attribute of the form, to run a function that validates your input. The browser will submit the form only if that function returns true.

UPDATE: You can define the action only after the form has been validated.

So, your html will look something like this:

<form id="myForm" onsubmit="return checkRecaptcha()" action="disabled">
<input type="text" name="myTextInput" value="">
<input type="submit" value="Submit">
</form>

And your javascript code, that defines the function will look like this:

function checkRecaptcha() {
  if (CaptchaInput.value == "") {
    document.getElementById("myForm").action="myCorrectUrl";
    return true;
  } else {
    alert("not allowed");
    return false;
  }
}

Then for catching the submit function:

document.getElementById("myForm").submit = function () {
  console.log("catched");
  return false;
}

edited Sep 05 '19 at 09:24

answered Sep 05 '19 at 08:36

Cosmin Staicu

1,809
2
20
27

1

This doesn't help, since calling form's submit method progammatically doesn't fire the onsubmit event. – Teemu Sep 05 '19 at 08:54
I've updated the answer with the `submit()` catching code. So, when the user pressed the submit button, the `checkRecaptcha()` function is triggered. When the form is submitted via javascript, the defined function is triggered, that just returns false. – Cosmin Staicu Sep 05 '19 at 09:10
@CosminStaicu The problem is that most bots would not even load the page, just submitting whatever generated spam content they have directly to backend endpoint. No JS can prevent this, since it won't even be executed. – Sergey Kudriavtsev Sep 05 '19 at 09:12
Now I submit the form by `HTMLFormElement.prototype.submit.call(document.getElementById("myForm"));`. @SergeyKudriavtsev True, but you can filter at least some of the spam by trying to prevent it to be submitted from a browser. – Teemu Sep 05 '19 at 09:15
Well, my answer was related to the original question: disable the submit() function of a form. Just like @Sergey Kudriavtsev said, you can not rely 100% on javascript to validate a form. The javascript validation is more... user related (so the user does not have to send in incorrect form to the server, just to receive an invalid field error). The final step for you will be to validate the form on the server side (for example, to check if the recaptcha value is correct, not just submitted). – Cosmin Staicu Sep 05 '19 at 09:20
So, I've updated the code with a workaround. The HTML definition of the code contains an invalid url for the `action`. The correct url is updated only inside the validation function. This way, if the form is submitted in any form, the results will not get to your server. – Cosmin Staicu Sep 05 '19 at 09:26

How do I stop bots from using .submit() to bypass my 'required' fields?

2 Answers2