How to AJAX form with recaptcha?

visible: false
debugger: false
sitemap:
    ignore: true
form:
  name: contact-form
  action: '/form'
  client_side_validation: false
  inline_errors: true
  keep_alive: true

  fields:
    -
      id: contact-name
      name: name
      label: CONTACT_FORM.NAME.LABEL
      autocomplete: true
      type: text
      validate:
        required: true
    -
      id: contact-email
      name: email
      label: CONTACT_FORM.EMAIL.LABEL
      type: email
      validate:
        required: true
        type: email
    -
      name: g-recaptcha-response
      type: captcha
      label: Captcha

  buttons:
    -
      type: submit
      value: CONTACT_FORM.BUTTON.SUBMIT

  process:
    -
      captcha: true
    -
      message: CONTACT_FORM.THANK_YOU
    -
      reset: true

{% include "forms/ajax-form-wrapper.html.twig" with {form_page: page.find('/form')} %}

{% do assets.addJs('jquery', 101) %}
{% do assets.addJs('https://cdn.jsdelivr.net/gh/cferdinandi/[email protected]/dist/saferInnerHTML.min.js', 50) %}
{% do assets.addJs('theme://js/form.min.js', 25) %}

{% set form_page = form_page ?? page %}
{% set page_form = page_form ?: (forms({"route": form_page.route}) ?: forms('contact-form')) %}

{% if page_form %}
    <div id="form-result-{{ page_form.name }}" class="text-left">
        {% include "forms/form.html.twig" with {form: page_form} %}
    </div>
    <script>
        $(function () {
            bindAjaxFormSubmit('{{ page_form.name }}', '{{ uri.base ~ uri.uri }}');
        });
    </script>
{% endif %}

function ajaxReq() {
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        return new ActiveXObject('Microsoft.XMLHTTP');
    } else {
        alert('Browser does not support XMLHTTP.');

        return false;
    }
}

function bindAjaxFormSubmit(id, page_url) {
    page_url = page_url || window.top.location.href;
    const xhr = ajaxReq();
    const responseHolder = document.getElementById('form-result-' + id);

    document.getElementById(id).addEventListener('submit', function (e) {
        e.preventDefault();
        this.querySelector('button[type="submit"]').disabled = true;

        xhr.open(this.getAttribute('method'), this.getAttribute('action'), true);
        xhr.send(new FormData(this));

        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                saferInnerHTML(responseHolder, xhr.response);
                bindAjaxFormSubmit(id, page_url);
            }
        }
    }, false);
}

recaptcha:
  version: 2-checkbox