Comment utiliser JavaScript pour vérifier si une demande a été soumise à plusieurs reprises

Lorsque les sites Web modernes traitent les demandes des utilisateurs, ils doivent parfois vérifier si la demande de l'utilisateur a été soumise à plusieurs reprises. Des soumissions répétées peuvent provoquer des anomalies de données ou des pannes du système. JavaScript est une partie très importante du développement front-end et peut nous aider à vérifier si les demandes sont soumises à plusieurs reprises. Dans cet article, nous verrons comment utiliser JavaScript pour vérifier si une demande est soumise deux fois.

Partie 1 : Qu'est-ce qu'une soumission en double ?

Dans le domaine du développement Web, il existe deux scénarios courants de soumissions répétées : premièrement, après avoir soumis le formulaire, l'utilisateur peut accidentellement ou malicieusement soumettre à nouveau les mêmes données du formulaire ; clique sur le bouton Ou lors de la création de liens, des retards de réseau ou d'autres problèmes peuvent survenir, amenant les utilisateurs à penser à tort que la soumission a échoué, puis à la soumettre à nouveau. Cela entraînera des soumissions en double.

Les soumissions en double peuvent avoir un impact sur l'application, comme provoquer des erreurs de données, une augmentation des frais, ou peuvent être exploitées pour attaquer l'application. Nous devons donc prendre des mesures pour éviter les soumissions en double.

Partie 2 : Comment éviter les soumissions en double ?

Afin d'éviter les soumissions répétées, nous pouvons prendre les mesures suivantes :

1. Ajoutez des jetons CSRF pour empêcher les attaques malveillantes.

2. Utilisez JavaScript pour vérifier les entrées de l'utilisateur sur le front-end afin de vous assurer que l'entrée est légale.

3. Utilisez JavaScript pour empêcher les utilisateurs de soumettre des formulaires ou des demandes à plusieurs reprises.

Dans cet article, nous nous concentrerons sur la troisième mesure, qui consiste à utiliser JavaScript pour empêcher les utilisateurs de soumettre des formulaires ou des demandes à plusieurs reprises.

Partie 3 : Comment utiliser JavaScript pour vérifier si une demande est soumise à plusieurs reprises ?

Dans cette section, nous apprendrons comment utiliser JavaScript pour vérifier si une demande a été soumise à plusieurs reprises.

1. Désactivez le bouton ou le lien de soumission en cas de clic sur le formulaire ou le lien. Cela empêche l'utilisateur de cliquer plusieurs fois sur le bouton d'envoi ou sur le lien avant que la demande aboutisse.

2. Avant de soumettre un formulaire ou une demande, utilisez JavaScript pour vérifier si la même demande a été soumise. Si tel est le cas, vous pouvez demander à l'utilisateur de ne pas soumettre à nouveau.

Voici le code pour implémenter la vérification ci-dessus :

function checkIfRequestSubmitted() {
  const lastRequestTime = localStorage.getItem('lastRequestTime');
  const currentRequestTime = new Date().getTime();
  const REQUEST_TIME_DELAY = 3000; // 3 seconds

  if (lastRequestTime && currentRequestTime - lastRequestTime < REQUEST_TIME_DELAY) {
    return true;
  }

  localStorage.setItem(&#39;lastRequestTime&#39;, currentRequestTime);
  return false;
}

function submitForm() {
  const form = document.getElementById(&#39;myForm&#39;);

  if (checkIfRequestSubmitted()) {
    alert(&#39;请不要重复提交！&#39;);
    return;
  }

  form.submit();
}

Le code ci-dessus utilise localStorage pour stocker l'heure de la demande la plus récente. Si la différence entre l'heure actuelle et l'heure de la dernière demande est inférieure à 3 secondes, la demande est considérée comme soumise. Sinon, mettez à jour l'heure de la dernière requête et effectuez l'opération de validation.

Enfin, nous devons appeler la fonction submitForm() dans l'événement clic du formulaire ou de la requête, par exemple :

<button onclick="submitForm()">提交</button>

De cette façon, même si l'utilisateur clique le bouton de soumission ou le lien plusieurs fois, le code JavaScript peut également être vérifié à temps pour éviter les soumissions répétées.

Conclusion :

Dans cet article, nous avons expliqué comment utiliser JavaScript pour vérifier si une demande est soumise deux fois. En désactivant les boutons ou les liens de soumission et en vérifiant l'heure de la dernière demande, nous pouvons efficacement empêcher les soumissions répétées, améliorer l'expérience utilisateur et protéger la sécurité des applications. Les problèmes de soumission en double sont courants dans le développement Web, nous devons donc garder à l'esprit les moyens d'éviter les soumissions en double afin de mieux gérer les demandes des utilisateurs.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!