Cara menggunakan JavaScript untuk menyemak sama ada permintaan telah dihantar berulang kali

Apabila tapak web moden memproses permintaan pengguna, mereka kadangkala perlu menyemak sama ada permintaan pengguna telah dihantar berulang kali. Penyerahan berulang boleh menyebabkan anomali data atau ranap sistem. JavaScript ialah bahagian yang sangat penting dalam pembangunan bahagian hadapan dan boleh membantu kami menyemak sama ada permintaan dihantar berulang kali. Dalam artikel ini, kami akan membincangkan cara menggunakan JavaScript untuk menyemak sama ada permintaan diserahkan dua kali.

Bahagian 1: Apakah itu penyerahan pendua?

Dalam bidang pembangunan web, terdapat dua senario biasa untuk penyerahan berulang: pertama, selepas menyerahkan borang, pengguna mungkin secara tidak sengaja atau secara berniat jahat menyerahkan semula data borang yang sama, kedua, selepas pengguna mengklik a butang atau pautan Pada masa ini, kelewatan rangkaian atau masalah lain mungkin berlaku, menyebabkan pengguna tersilap percaya bahawa penyerahan itu tidak berjaya dan kemudian menyerahkan semula. Ini akan membawa kepada penyerahan pendua.

Penyerahan pendua mungkin mempunyai kesan pada aplikasi, seperti menyebabkan ralat data, bayaran meningkat atau boleh dieksploitasi untuk menyerang aplikasi. Oleh itu, kita perlu mengambil langkah untuk mengelakkan penyerahan pendua.

Bahagian 2: Bagaimana untuk mengelakkan penyerahan pendua?

Untuk mengelakkan penyerahan berulang, kami boleh mengambil langkah berikut:

1. Tambah token CSRF untuk mengelakkan serangan berniat jahat.

2. Gunakan JavaScript untuk mengesahkan input pengguna di bahagian hadapan untuk memastikan bahawa input itu sah.

3. Gunakan JavaScript untuk menghalang pengguna daripada menghantar borang atau permintaan berulang kali.

Dalam artikel ini, kami akan menumpukan pada langkah ketiga, iaitu menggunakan JavaScript untuk menghalang pengguna daripada menghantar borang atau permintaan berulang kali.

Bahagian 3: Bagaimana menggunakan JavaScript untuk menyemak sama ada permintaan dihantar berulang kali?

Dalam bahagian ini, kita akan belajar cara menggunakan JavaScript untuk menyemak sama ada permintaan diserahkan dua kali.

1 Lumpuhkan butang hantar atau pautan apabila klik pada borang atau pautan. Ini menghalang pengguna daripada mengklik butang hantar atau pautan beberapa kali sebelum permintaan itu berjaya.

2 Sebelum menyerahkan borang atau permintaan, gunakan JavaScript untuk menyemak sama ada permintaan yang sama telah diserahkan. Jika ya, anda boleh menggesa pengguna untuk tidak menyerahkan lagi.

Berikut ialah kod untuk melaksanakan semakan di atas:

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();
}

Kod di atas menggunakan localStorage untuk menyimpan masa permintaan terkini. Jika perbezaan antara masa semasa dan masa permintaan terakhir adalah kurang daripada 3 saat, permintaan itu dianggap telah diserahkan. Jika tidak, kemas kini masa permintaan terakhir dan lakukan operasi komit.

Akhir sekali, kita perlu memanggil fungsi submitForm() dalam acara klik borang atau permintaan, contohnya:

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

Dengan cara ini, walaupun pengguna mengklik serah butang atau pautan beberapa kali, kod JavaScript Ia juga boleh disemak dalam masa untuk mengelakkan penyerahan berulang.

Kesimpulan:

Dalam artikel ini, kami membincangkan cara menggunakan JavaScript untuk menyemak sama ada permintaan diserahkan dua kali. Dengan melumpuhkan butang serah atau pautan dan menyemak masa permintaan terakhir, kami boleh menghalang penyerahan berulang dengan berkesan, meningkatkan pengalaman pengguna dan melindungi keselamatan aplikasi. Isu penyerahan pendua adalah perkara biasa dalam pembangunan web, jadi kami perlu mengingati cara untuk mencegah penyerahan pendua untuk mengendalikan permintaan pengguna dengan lebih baik.

Atas ialah kandungan terperinci Cara menggunakan JavaScript untuk menyemak sama ada permintaan telah dihantar berulang kali. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!