ส่งค่าผ่าน ajax แบบ get และ post ทำอย่างไร

บทความนี้ ผมจะกล่าวถึงวิธีการส่งค่า จากเกม ที่สร้างด้วยโปรแกรม constuct 2 ไปยังเว็บไซต์ที่กำหนด เพื่อแลกเปลี่ยนข้อมูลหรือปรับปรุงข้อมูลของเกม โดยอาศัยความสามารถของ ajax เป็นตัวช่วย

การส่งผ่านค่าระหว่างไฟล์ของเว็บต่างๆ ผู้อ่านบทความคงพอจะทราบอยู่แล้วว่า มีการส่งผ่านได้สองแบบ คือ แบบ get และแบบ post แต่ถ้าหากยังไม่ทราบ อันนี้ขอให้ได้ศึกษาหาความรู้เพิ่มเติมอีกเล็กน้อย

การส่งค่าแบบ  get คือการส่งข้อมูลไปกับที่อยู่ของเว็บ (URL) การส่งข้อมูลแบบนี้ผู้ใช้งานเว็บก็จะมองเป็นข้อมูลที่ส่งไป  เช่น ส่งค่า username ไปยังเว็บเพจ login ก็จะมองเห็นเป็นลักษณะนี้

http://www.youdoman.com/login.html?username=witoon

การส่งค่าแบบ post คือการส่งข้อมูลแบบปกปิด ผู้ใช้งานเว็บ จะไม่สามารถมองเห็นข้อมูลที่ส่งไปได้ ทำให้เกิดความปลอดภัยในการส่งข้อมูล และไม่จำกัดขนาดของข้อมูลที่ส่งไปอีกด้วย

การส่งค่าผ่าน ajax ใน construct 2

การส่งค่าระหว่างเกมที่สร้างด้วยโปรแกรม construct 2 กับเว็บไซต์  จะอาศัยคุณสมบัติของ ajax มาช่วยในการส่งข้อมูล ซึ่งการส่งข้อมูลจะมีสองลักษณะ คือ get  และ post โดยผมจะขอยกตัวอย่าง การส่งข้อมูล ชื่อผู้ใช้ และรหัสผ่าน ไปยังเว็บไซต์ เพื่อดึงข้อมูลการลงทะเบียนเกมจากเว็บไซต์
หน้าตาของเกม ที่ออกแบบไว้ ให้มี Text Box สองตัว คือ txt_username และ txt_password

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

1. การส่งค่าแบบ get

เพิ่ม event สำหรับปุ่ม ลงทะเบียน แล้วกำหนด action เป็น ajax => Posts to URL

กำหนดค่า Tag เพื่อเป็นชื่อสำหรับใช้ตรวจสอบการทำงาน

กำหนด URL เพื่อส่งค่าข้อมูล

"http://www.youdomain.com/register.php?username="&txt_username.Text&"&password="&txt_password.Text

การส่งค่าแบบ get จะเขียนข้อมูลต่อท้ายกับ URL และส่งไปพร้อมกัน

ค่า Data ไม่ต้องกำหนด

ค่า Method กำหนดให้เป็นการส่งแบบ GET

2. การส่งค่าแบบ post

เพิ่ม event สำหรับปุ่ม ลงทะเบียน แล้วกำหนด action เป็น ajax => Posts to URL

กำหนดค่า Tag เพื่อเป็นชื่อสำหรับใช้ตรวจสอบการทำงาน

กำหนด URL เพื่อส่งค่าข้อมูล http://www.youdomain.com/register.php

ค่า Data จะกำหนดข้อมูลที่จะส่งไปยัง URL ที่กำหนดไว้
"username="&txt_username.Text&"&password="&txt_password.Text

โดยย้ายจากวิธีการส่งแบบ get ที่ ต่อท้าย URL มาใส่ไว้ในช่อง Data แทนนั้นเอง

ค่า Method กำหนดให้เป็นการส่งแบบ POST

การรับค่าที่ส่งมาจาก construct 2

ในการรับค่าข้อมูลที่ส่งมาจากโปรแกรม construct 2 เพื่อนำไปใช้งานต่อไปนั้น ในส่วนนี้ ผมกล่าวถึงไฟล์ php ที่จะทำงานบนเว็บไซต์ของเกมนะครับ ไม่ได้พูดถึง event sheets ที่อยู่ใน construct 2 หลักสำคัญที่ต้องเพิ่มเติมจากการรับค่าระหว่างเว็บทั่วไป คือ ต้องเพิ่ม header เข้ามาอีก 1 ตัว คือ

    header('Access-Control-Allow-Origin: *');

ถ้าผู้เขียนส่งค่ามาด้วยวิธีการ get จะต้องรับค่าด้วย $_GET ดังนี้

$username = $_GET["username"];
$password = $_GET["password"];

ถ้าผู้เขียนส่งค่ามาด้วยวิธีการ post จะต้องรับค่าด้วย $_POST ดังนี้

$username = $_POST["username"];
$password = $_POST["password"];


จากเนื้อหาที่กล่าวมาข้างต้น เป็นเพียงหลักการทำงานของ ajax ในการส่งค่าระหว่างตัวเกม construct 2 กับเว็บไซต์ ในการนำไปใช้งานจริงนั้น ผู้เขียนเกมควรศึกษาวิธีการเขียนเว็บด้วยภาษา php ศึกษาหลักการทำงานของเว็บไซต์ เพื่อให้สามารถนำไปประยุกต์ใช้งานให้เกิดประโยชน์ได้อย่างแท้จริง เพราะผมเชื่อว่า คงมีหลายคนที่อ่านบทความนี้จบแล้ว จะพูดว่า ไม่เห็นจะเข้าใจเลย แต่ผมหวังว่าจะมีสักคนที่เข้าใจและนำไปใช้ได้ ขอให้สนุกกับการสร้างเกม ด้วย construct 2 นะครับ