Gửi biểu mẫu bằng phương thức POST trong JavaScript

Bây giờ hãy học cách gửi biểu mẫu bằng phương thức POST. Để làm điều này, thuộc tính method của biểu mẫu cần được đặt thành giá trị tương ứng:

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

Sự khác biệt của việc gửi bằng phương thức POST là dữ liệu được gửi sẽ không hiển thị trên thanh địa chỉ trình duyệt. Điều này thuận tiện khi dữ liệu quá dài, hoặc chúng ta không muốn hiển thị chúng cho người dùng trên thanh địa chỉ.

Dữ liệu được gửi bằng phương thức POST sẽ được đặt trong thuộc tính post của đối tượng dữ liệu trên máy chủ của chúng ta:

export default {
	'/handler/': function(data) {
		console.log(data.post);
		return 'test';
	}
}

Để ngắn gọn, bạn có thể sử dụng phép hủy cấu trúc, để đưa dữ liệu của chúng ta vào một biến riêng biệt:

export default {
	'/handler/': function({post}) {
		console.log(post);
		return 'test';
	}
}

Hãy hỏi người dùng về tên đăng nhập và mật khẩu. Sau khi gửi, hãy so sánh chúng với tên đăng nhập và mật khẩu được lưu trữ trong các biến trên máy chủ. Nếu dữ liệu khớp, hiển thị thông báo thành công, ngược lại - thông báo thất bại.