[AJAX] Recaptcha, Token invalidé

Bonjour,
j'ai un site internet monopage avec un formulaire de contact en bas. J'ai voulu y integré un reCaptcha V3 afin d'arreter les spams. Cependant, au bout de 2 minutes de navigation, le "Token" est invalidé. J'ai donc essayé de trouver une solution en ajax

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script>
 
grecaptcha.ready(function() {
    document.getElementById('contacte').addEventListener("submit", function(event) {
        event.preventDefault();
        grecaptcha.execute('maclé', {action: 'homepage'}).then(function(token) {
        document.getElementById('recaptchaResponse').value = token;
        document.getElementById('contacte').submit();
 
    });
}, false);
});
 
</script>

et mon script d'envoie des information vers mon fichier php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$('#contacte').on('submit', function()    
        {
            var nom=$('#name').val();
            var contenu=$('#message').val();
            var captcha=$('#recaptchaResponse').val();
            var form = $(this);
            var formParams = form.serialize();
            $.ajax(
            {
                url: 'mail.php',
                type: 'POST',
                traditional: true,
                data: {
                    name:nom,message:contenu,recaptcha_response:captcha
                },
                success: function(data){
                }
            })
            return false;
        });

Malgré cela, l'envoie au php semble ce déroulé avant la génération de mon grecaptcha

Je suis novice, et je pêche sur ca depuis un moment sans trouver de solutions.

Je vous mets egalement mon formulaire

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<form id="contacte" action="#" method="post">
    <div class="fields">
        <div class="field half">
            <input type="text" name="name" id="name" placeholder="Nom" value="azer" />
        </div>
        <div class="field half">
            <input type="email" name="email" id="email" placeholder="Email" value="julien.jeunepapa@gmail.com"/>
        </div>
        <div class="field">
            <textarea name="message" id="message" placeholder="Message" rows="7">vcfbfhgf</textarea>
        </div>
    </div>
    <ul class="actions">
        <li><input id="envoiemail" type="submit" value="Envoyer" class="button primary" />
        </li>
        <li>Ce site est protégé par reCAPTCHA et Google
            <a href = "https://policies.google.com/privacy"> Politique de confidentialité </a> et 
            Les <a href = "https://policies.google.com/terms"> conditions d'utilisation </a> s'appliquent. </li>
 
    </ul>
    <input type="hidden" name="recaptcha_response" id="recaptchaResponse">
</form>