ทำเกม Multiplayer ด้วย Node js และ Socket.io ตอนที่ 1

สวัสดีครับ กลับมาพบกับเทคนิคในการทำเกมด้วย Unity กันอีกครั้งนะครับ วันนี้ก็จะเป็นการเริ่มซีรี่ย์ใหม่กับการเขียนเกมแบบ Multiplayer  โดยใช้ Node.js ในการเขียนตัวเซิฟเวอร์กันครับ

สิ่งที่เราต้องเตรียมนอกเหนือจาก Unity แล้วก็คือ

• Node.js
• Visual Studio Code
• Socket.io Library สำหรับ Unity ( ดาวโหลดได้จาก Asset store )

ตอนนี้เวอร์ชั่นของ Node.js ล่าสุดที่เขียนบทความ อยู่ที่เวอร์ชั่น 12.14.1 นะครับ

ตอนเรา Install Node.js ลงเครื่อง มีส่วนที่ต้องเลือกเพิ่มนะครับ เผื่อว่าเครื่องของบางคนมีของไม่ครบ มันจะติดตั้งส่วนที่ขาดให้เราด้วยครับ

เมื่อเราติดตั้งมาแล้ว เราจะมา Setup Folder ให้กับโปรเจคของเรากันนะครับ ซึ่งทำได้โดยการเปิด Visual Studio Code มา และเลือก Select Folder เพื่อนๆจะใช้รูปแบบการตั้งโครงส้รางโฟลเดอร์แบบผมก็ได้นะครับ คือมี Folder หลักและ Folder สำหรับ Client และ Server ครับ

จากนั้นให้เราเปิดหน้าต่าง Terminal ขึ้นมาครับ

เสร็จแล้วในหน้าต่าง Terminal ให้เราพิมพ์ node –v เพื่อเช็คเวอร์ชั่น และตรวจสอบว่าเครื่องของเรามี Node.js ติดตั้งแล้วเรียบร้อยกันก่อนนะครับ

จากนั้นเราจะทำการ init ผ่านคำสั่ง npm init ครับ ซึ่งเราก็ต้องตั้งค่า Server ของเรานิดหน่อย เริ่มจาก Package name ตรงนี้ห้ามตั้งเป็นตัวพิมพ์ใหญ่นะครับ

เวอร์ชั่น คำอธิบาย server และจุดเริ่มต้นไฟล์ js ของเราครับ

ผู้พัฒนา จะใส่หรือไม่ใส่ก็ได้นะครับ

เมื่อเสร็จแล้วใน Folder ของเราก็จะได้ไฟล์ JSON มา เป็นตัวบอกรายละเอียดของเซิฟเวอร์ของเราครับ ซึ่งเราสามารถมาแก้ไขทีหลังได้จากไฟล์ JSON นี้ครับ

ถัดมาเราจะติดตั้ง nodemon เพื่อให้ Server อัพเดตทุกครั้งที่เรา save ครับ โดยใช้คำสั่ง npm install nodemon

จากนั้นติดตั้ง socketio ด้วยคำสั่ง  npm install socket.io

ติดตั้ง short id ด้วยคำสั่ง npm install shortid

ต่อจากนั้นเราจะสร้างไฟล์ index.js เพื่อเป็นตัวเริ่มต้นของเซิฟเวอร์ของเรากันครับ โดยการกด New file ในโฟลเดอร์ Server ของเรา แล้วเราจะได้ไฟล์ index.js ว่างๆ มาครับ

ต่อมาเราจะทำการสร้าง Unity project ซึ่งจะให้ดีเราก็ควรเอาไว้ใน Folder เดียวกันเพื่อให้ง่ายต่อการทำงานครับ

แล้วให้เราเปิด Asset store เพื่อดาวน์โหลด Asset Socket.io สำหรับ Unity ครับ โดยเราสามารถค้นหา Socket.io ได้เลยครับ

สร้าง Game object และ Script มา โดยในที่นี้ผมตั้งชื่อว่า NetworkClient เพื่อเตรียมไว้สำหรับการเชื่อมต่อกับ Server

ซึ่งคลาสนี้เราจะ inherit มาจากคลาส SocketIOComponent เพื่อให้ใช้ฟังชั่นต่างๆของ Socket.io ได้นะครับ

ถ้าเราไปดูในหน้า Inspector Panel เราจะได้ช่องสำหรับใส่ค่าต่างๆ ที่ถูกตั้งไว้ใน Base class นั่นเองครับ

กลับไปที่ Visual Studio Code เราจะเขียนฟังชั่นเพื่อเปิด Server รอรับการ Connect จากตัวเกมกันครับ โดยจะมีสคริปต์ดังนี้

และเราจะใช้คำสั่ง nodemon เพื่อให้ Server ถูก Restart ทุกครั้งที่เรามีการแก้ไขโดยใช้คำสั่ง nodemon index.js  ใน Terminal ครับ ซึ่งเราจะเห็นว่าทันทีที่เรา Save เราจะได้ log ว่า Server has stared มาแสดงครับ

เท่านี้ Server เราก็พร้อมที่จะรับการเชื่อมต่อมาจาก Client แล้วครับ โดยเราจะต้องใส่ Code เพื่อรอรับการเชื่อมต่อดังนี้ครับ

จากนั้นเราจะทำการแก้ไข Code ของ Unity เพื่อให้เราสามารถ Connect ไปยัง Server ได้นั่นเองครับ

ขั้นแรกเราต้องไปเปลี่ยนการเข้าถึงของคลาส SocketIOComponent เพื่อให้เราสามารถเรียกใช้ Start และ Update ผ่านทาง NetworkClient ของเราได้ครับ

ทีนี้เราก็จะ Override ฟังชั่นที่คลาส NetworkClient พร้อมทั้งเรียกฟังชั่น Start จากคลาสแม่เพื่อให้เกมของเรา Connect ไปยัง Server

ซึ่งถ้าเรากด Play หน้าต่าง Terminal ใน Visual Studio Code ก็จะแสดงให้เห็นว่ามีการ Connect เข้ามาแล้วเรียบร้อยครับ

เท่านี้ Unity เกมของเราก็สามารถ Connect ไปยัง Server socket ของเราได้แล้วนะครับ ซึ่งในตอนหน้าเราก็จะสร้าง Player เพื่อเชื่อมต่อและบอกทุกๆ Client ที่เชื่อมต่ออยู่ว่ามีคนเข้ามาเพื่อหรือมีคนออกไปครับ ติดตามกันต่อตอนที่ 2 นะครับ