การส่งฟอร์มด้วยวิธี POST ใน JavaScript

ตอนนี้เรามาเรียนรู้วิธีการส่งฟอร์ม ด้วยวิธี POST กัน สำหรับสิ่งนี้ ให้กำหนดแอตทริบิวต์ method ของฟอร์มเป็นค่าที่สอดคล้องกัน:

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

ข้อแตกต่างของการส่งด้วยวิธี POST คือ ข้อมูลที่ส่งจะไม่ปรากฏในแถบที่อยู่ ของเบราว์เซอร์ สิ่งนี้สะดวกเมื่อข้อมูล ยาวเกินไป หรือเราไม่ต้องการแสดง ข้อมูลเหล่านั้นให้ผู้ใช้เห็นในแถบที่อยู่

ข้อมูลที่ส่งด้วยวิธี POST จะเข้ามา ในเซิร์ฟเวอร์ของเราในคุณสมบัติ post ของอ็อบเจ็กต์ ข้อมูล:

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

เพื่อความกระชับ สามารถทำการดึงโครงสร้าง (destructuring) เพื่อรับข้อมูลของเราเข้าไปในตัวแปรแยก:

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

ถามผู้ใช้เกี่ยวกับล็อกอินและรหัสผ่าน หลังจาก ส่งข้อมูลแล้ว ให้เปรียบเทียบกับล็อกอินและรหัสผ่าน ที่เก็บไว้ในตัวแปรบนเซิร์ฟเวอร์ หาก ข้อมูลตรงกัน ให้แสดงข้อความแจ้งความสำเร็จ มิฉะนั้น - แจ้งความล้มเหลว