Kaedah Menghantar Borang dalam JavaScript

Borang boleh dihantar dengan dua cara: kaedah GET atau kaedah POST. Cara penghantaran borang dikawal oleh atribut method borang.

Sebagai contoh, mari tentukan kaedah penghantaran GET untuk borang:

<form action="/handler/" method="GET">
	<input name="test1">
	<input name="test2">
	<input type="submit">
</form>

Dan sekarang kaedah POST:

<form action="/handler/" method="POST">
	<input name="test1">
	<input name="test2">
	<input type="submit">
</form>

Sekarang mari kita lihat, apakah perbezaan antara dua kaedah penghantaran. Dalam kes kaedah GET, data borang akan kelihatan dalam pelayar dalam bentuk yang dipanggil rentetan parameter (query string), yang mewakili pasangan dalam bentuk kunci-nilai, di mana kunci adalah nama elemen borang, dan nilainya adalah data yang dimasukkan ke dalamnya. Pasangan nilai akan dipisahkan oleh ampersand.

Data yang dihantar dengan kaedah GET akan sampai di pelayan kita dalam sifat get objek bersama data:

export default {
	'/handler/': function(data) {
		console.log(data.get); // akan dipaparkan dalam konsol pelayan
		return 'form data received';
	}
}

Manakala data yang dihantar dengan kaedah POST akan sampai di pelayan kita dalam sifat post objek bersama data:

export default {
	'/handler/': function(data) {
		console.log(data.post); // akan dipaparkan dalam konsol pelayan
		return 'form data received';
	}
}

Untuk ringkasnya, anda boleh melakukan destructuring, untuk mendapatkan data kita ke dalam pembolehubah berasingan:

export default {
	'/handler/': function({get, post}) {
		console.log(get);
		console.log(post);
		return 'form data received';
	}
}