vue canvas websocket

vue+canvas+websocket+น้อยกว่า

เพื่อฝึกฝน Canvas, Websocket และ Node ฉันได้สร้างเกมเล็กๆ ขึ้น คุณสามารถคลิกที่นี่เพื่อดูมันทางออนไลน์

ภาพหน้าจอของโครงการ

สร้างการตั้งค่า

//clone
npm install
//start server
node app.js
//start vue in another terminal
npm run dev

ความคืบหน้าการเสร็จสิ้น

• เข้าสู่ระบบ หลังจากเข้าสู่ระบบ ชื่อผู้ใช้จะถูกจัดเก็บไว้ใน sessionStorage
• หลังจากเข้าสู่ระบบ คุณสามารถเลือกที่นั่งและบอกที่นั่งของคุณแก่ทุกคนผ่านทาง ws
• ส่งเนื้อหา หลังจากเข้าสู่ระบบ คุณสามารถเผยแพร่เนื้อหาอินพุตให้กับทุกคนผ่านทาง ws
• ประวัติการแชทสามารถรับเนื้อหาการพิมพ์แชทของทุกคนและล้างหน้าจอได้
• หากต้องการเริ่มเกม คุณสามารถคลิกปุ่มเริ่มเกมที่ชั้น 1 หลังจากเริ่มเกม คุณจะไม่สามารถปรับที่นั่งได้
• ผลัดกันวาดภาพและเดาคำศัพท์โดยดูรูปภาพตามลำดับที่นั่ง ไม่อนุญาตให้ผู้เล่นที่วาดภาพเข้าหรือส่งเนื้อหา
• สุ่มเลือกคำศัพท์จากรายการคำศัพท์ มีการเขียนเพียง 12 คำเพื่อการปฏิบัติ
• การแสดงพิเศษเมื่อเนื้อหาที่ส่งเป็นคำที่ถูกต้อง (ใช้ได้หลังจากเกมเริ่ม)
• เก็บคะแนนไว้
• เกมหลายห้อง
• เทอร์มินัลมือถือ