1. รายงานโครงการ
ระบบสั่งซื้อสินค้าออนไลน์ (Online Purchase System)
จัดทาโดย
B5304516 นายภูริเดช สุดสี
เสนอ
อาจารย์วิชัย ศรีสุรักษ์
รายงานประกอบรายวิชา 423423 โครงการวิศวกรรมคอมพิวเตอร์ 3 ภาคการศึกษาที่ 1/2556
มหาวิทยาลัยเทคโนโลยีสุรนารี จ.นครราชสีมา

2. สารบัญ
เรื่อง หน้า
บทที่ 1 : บทนา
1.1 ที่มาและความสาคัญของโครงการ 4
1.2 หลักการและเหตุผล 4
1.3 วัตถุประสงค์ 5
1.4 เครื่องมือที่ใช้ 5
1.5 ระยะเวลากาเนินการ 6
1.6 งบประมาณ 6
บทที่ 2 : หลักการทางาน
2.1 การเริ่มต้นใช้งาน WebSocket API 7
2.2 การดาเนินการของฝั่ง Client 8
2.3 การดาเนินการของฝั่ง Server 12
บทที่ 3 : สรุปและข้อเสนอแนะ
3.1 ข้อบกพร่อง หรือข้อจากัดของโปรแกรม 15
3.2 ข้อเสนอแนะ 15
3.3 สรุป 15
บทที่ 4 : บรรณานุกรม
4.1 บรรณานุกรม 16

3. แผนผังการทางานของระบบ
1
>>command
>>doing….
>>Save DB
เลือกทารายการ
เชื่อมต่อผ่านระบบ Internet
หรือโทรศัพท์
ประมวลผลคาสั่ง
บันทึกลงฐานข้อมูล
ส่งคาสั่ง USSD

4. 4
บทที่ 1 : บทนา
1.1 ที่มาและความสาคัญของโครงการ
ปัจจุบันการซื้อขายสินค้าสามารถทาได้หลายช่องทาง และมีความสะดวกมากขึ้นจากการใช้
เทคโนโลยีเข้ามาช่วยในการทารายการซื้อขายซึ่งนอกจากจะช่วยผู้ใช้บริการมีความสะดวกรวดเร็วแล้ว
ยังช่วยให้ผู้ให้บริการสามารถนาข้อมูลที่ได้จากรายการสั่งซื้อไปใช้ประโยชน์ในด้านต่างๆ เช่นวิเคราะห์
ความต้องการของผู้ใช้บริการ ประมวลผลคาสั่งซื้อได้อย่างรวดเร็ว มีฐานข้อมูลลูกค้า ตรวจสอบการ
ชาระเงินได้ทันที และสามารถให้บริการได้ตลอดเวลาเป็นต้น ซึ่งจากข้อดีเหล่านี้ทาให้มีการประยุกต์
เทคโนโลยีเข้ามาช่วยในการชาระค้าสินค้าหรือบริการหลายประเภทเช่น In-App Purchase ซึ่งเป็น
ระบบชาระเงินที่ติดมากับโปรแกรมประยุกต์ในโทรศัพท์มือถือเพื่อชาระเงินแก่ผู้ผลิตโปรแกรมประยุกต์
นั้น หรือ Mobile Payment ซึ่งเป็นการชาระค่าสินค้าหรือบริการโดยใช้โทรศัพท์มือถือเป็นตัวควบคุม
การจ่ายเงินโดยจะทาการสั่งไปที่ผู้ให้บริการและผู้ให้บริการจะหักเงินและค่าบริการจากบัญชีผู้ใช้แล้ว
ดาเนินการจ่ายเงินตามที่ผู้ใช้บริการสั่ง
เนื่องจากการใช้บริการดังกล่าวมีความจาเป็นต้องเติมเงินเข้าไปในบัญชีผู้ใช้ซึ่งจะกลายเป็นเงิน
เสมือนหรือเครดิตในฐานข้อมูลของผู้ให้บริการ ซึ่งมีความยุ่งยากในการที่ต้องสมัครบัญชีผู้ใช้และการ
ยืนยันบัญชีผู้ใช้หลายขั้นตอนทาให้ไม่สะดวก ดังนั้นจึงมีความต้องการที่จะซื้อสินค้าผ่านระบบออนไลน์
โดยใช้เงินสดมากขึ้นทุกขณะ เพราะไม่จาเป็นต้องมีบัญชีผู้ใช้และมีความเป็นส่วนตัวในการทาธุรกรรม
เหมือนการทาธุรกรรมผ่านธนาคารออนไลน์ (E-banking) ทั่วๆไป ดังนั้นผู้จัดทาโครงงานจึงได้จัดทา
ระบบการซื้อขายสินค้าผ่านระบบออนไลน์โดยใช้เงินสดขึ้น เพื่อช่วยอานวยความสะดวกแก่ผู้ใช้บริการ
ดังกล่าวข้างต้น
1.2 หลักการและเหตุผล
เนื่องจากปกติการซื้อขายสินค้าออนไลน์มีข้อจากัดในการทารายการสั่งซื้อเนื่องจากต้องใช้คนคอย
ติดตามคาสั่งซื้อและสถานะการชาระค่าสินค้าอยู่ตลอดเวลา รวมทั้งมีความน่าเชื่อถือต่าเนื่องจากไม่รู้ว่า
ผู้ขายมีสินค้าจริงหรือไม่ ดังนั้นระบบเติมเงินออนไลน์นี้จึงจัดทาขึ้นเพื่อตอบสนองความต้องการมั่นใจใน
การซื้อขายและให้บริการได้อย่างรวดเร็ว โดยตัวเครื่องรับชาระเงินจะดาเนินการรับรายการและโต้ตอบ

5. 5
กับผู้ใช้งานผ่านหน้าจอ Tablet ที่รันระบบปฏิบัติการ Android เป็นส่วนของ User Interface ของ
ระบบ และใช้การป้อนข้อมูลด้วยปุ่มแยกจากเครื่องTablet ผ่านตัวปรับอุปกรณ์รับส่งค่า IOIO ให้รับค่า
จากปุ่มกดมาที่ระบบ และเมื่อทารายการและยืนยันความถูกต้องของรายการแล้วระบบจึงจะแจ้งราคา
ค่าใช้จ่าย และให้ป้อนเงินเข้าสู่ระบบโดย IOIO จะสลับไปใช้โมดูลรับเงินจากผู้ใช้ และเมื่อระบบ
ตรวจสอบการทารายการถูกต้องแล้วจะดาเนินการเชื่อมต่อกับระบบอื่นที่จาเป็นเช่นระบบ API เติมเงิน
โทรศัพท์ แล้วจึงจะสั่งงานให้ IOIO จะสลับไปใช้เครื่องพิมพ์ใบเสร็จหรือเครื่องพิมพ์บัตรในกรณีที่การ
จ่ายเงินต้องการการยืนยันด้วยใบเสร็จ นอกจานี้ยังจะมีฟังก์ชันที่ช่วยในการออมเงินเพื่อซื้อสินค้า หรือ
ออมเงินเก็บสาหรับส่งเสริมการออมได้อีกด้วย
1.3 วัตถุประสงค์
1. ศึกษาค้นคว้าความรู้พื้นฐานในการเชื่อมต่อระบบชาระเงินกับระบบชาระค่าสินค้าหรือบริการ
2. ศึกษารับส่งข้อมูลโดยใช้ตัวสลับอุปกรณ์รับส่งข้อมูล IOIO
3. เพื่อสร้างต้นแบบอุปกรณ์รับชาระเงินในการซื้อขายสินค้าออนไลน์
4. เพื่อสร้างฐานข้อมูลออนไลน์ในการวิเคราะห์และวิจัยความต้องการซื้อของผู้ใช้บริการในแต่ละ
สถานที่
5. นาความรู้ด้านไมโครคอนโทรเลอร์และในรายวิชาอื่นๆ มาใช้ประยุกต์ทาชิ้นงานจริง
1.4 เครื่องมือที่ใช้
1. MySQL
2. Android Developer Tool (ADT) with SDK API Level 16
3. Tablet support 3G with Android OS 4.1.2 (Jelly Bean)
4. IOIO activity board (PIC24FJ256DA)
5. ปุ่มกด Navigator และ Numpad

6. 6
1.5 ระยะเวลาดาเนินการ
กิจกรรม
มิถุนายน กรกฎาคม สิงหาคม
1. ศึกษาค้นคว้าข้อมูล
2. เขียนเค้าโครงของโครงการและดาเนินการ
ด้านเอกสารโครงการ
3. ทาการเชื่อมต่อระบบ API
4. ทาการเชื่อมต่อ Tablet กับระบบ
5. สร้างระบบชาระเงิน
6. เชื่อมต่อระบบรับส่งข้อมูลกับ IOIO
7. ทดสอบระบบในภาพรวม
8. สรุปผลและรายงานโครงการ
1.6. งบประมาณ
1. เครื่อง Tablet หรืออุปกรณ์เทียบเท่า 3,500 บาท
2. อุปกรณ์โมดูลรับเงินชนิดธนบัตร 2,500 บาท
3. ปุ่มกด 500 บาท
4. อุปกรณ์สลับสัญญาณ Input Output (IOIO) 2,500 บาท
5. เครื่องพิมพ์ใบเสร็จ 5,000 บาท
รวม 14,000 บาท

7. 7
บทที่ 2 : หลักการทางาน
2.1 การเริ่มต้นใช้งานของ WebSocket API
WebSocket คือ การเชื่อมต่อการส่งข้อมูลแบบ Full-Duplex โดยใช้ TCP protocol เพียง
Connection เดียวและได้มีการร้องขอ RFC 6455 ในปี ค.ศ. 2011 โดยอาศัยการทางานของ HTTP
protocol ในการยกระดับการใช้งานการเชื่อมต่อให้เป็น WebSocket ทาให้การร้องขอการใช้งานคล้าย
กับการร้องขอ (Request) หรือตอบสนอง (Response) ของ HTTP header แต่การใช้ WebSocket มี
ความสัมพันธ์กับ HTTP protocol เพียงแค่ใช้ในการยกระดับการเชื่อมต่อเป็น WebSocket เท่านั้น
และใช้รูปแบบข้อกาหนดการยืนยันตัวตนแบบ CHAP (Challenge-Handshake Authentication
Protocol) โดยมีการกาหนดรูปแบบของการ Handshaking ดังนี้
GET /mychat HTTP/1.1
Host: server.example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Protocol: chat
Sec-WebSocket-Version: 13
Origin: http://example.com
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept:
s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
Sec-WebSocket-Protocol: chat
ฝั่ง Client ร้องขอการยืนยันตัวตน ฝั่ง Server ตอบสนองคาร้องขอ
รูป 1.แสดงตัวอย่างของ Handshake ของ ws protocol

8. 8
รูป 3.อุปกรณ์ IOIO
โดย Sec-WebSocket-Accept เกิดจาก
2.2 การดาเนินการของฝั่ง Client
- IOIO และ Library
IOIO หรือเรียกว่า “โยโย่” เป็นอุปกรณ์ใช้
งาน Multi-Input/Output โดยเมื่อเราเสียบสายเช่น
USB หรือต่อผ่านระบบไร้สายเช่น Bluetooth กับ
อุปกรณ์สั่งงาน IOIO ก็จะทาหน้าที่รับ Input หรือ
Output ตามที่เรากาหนดไว้ได้ โดยอุปกรณ์
IOIO ที่ใช้ในการทาโครงการนี้เป็นรุ่น
PIC24FJ256DA ปฏิบัติงานที่แรงดันไฟฟ้า 5-15V และกระแสไฟฟ้าที่ 1A โดยสามารถรับ
Input/Output สูงสุดได้ถึง 48 port และการใช้งานอุปกรณ์ IOIO นั้นมีการเปิดเผย Source code
และเปิดให้ Download Library โดยสามารถเข้าไป Download ได้ที่เว็บไซต์
https://github.com/ytai/ioio/
เอา dGhlIHNhbXBsZSBub25jZQ== จาก Client
ต่อท้ายด้วย GUID ของเครื่อง Server
=
dGhlIHNhbXBsZSBub25jZQ==258EAFA5-E914-47DA-95CA-C5AB0DC85B11
ทาการเข้ารหัสแบบ SHA-1 สตริงที่ได้จากการต่อท้ายด้วย GUID
b37a4f2cc0624f1690f64606cf385945b2bec4ea เป็น Hex
แปลง Hex หนึ่งครั้ง แล้วเข้ารหัสแบบ Base64
s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
รูป 2.แสดงการหา Accept key

9. 9
รูป 4. IOIO Library
รูป 5.IOIO JAR Library
- Library
การเรียกใช้ Library ของ IOIO ใน Android Developer Tool (ADT) นั้นต้องทาการติดตั้ง
Library ใน Project -> Properties ดังต่อไปนี้
ซึ่งเป็น API ที่ออกแบบมาเพื่อช่วยให้การรับ Input/Output จาก IOIO มีความสะดวกมากขึ้น และ
เรียกใช้ Library จากภายนอกเพื่อใช้ในการเชื่อมต่อ WebSocket ดังนี้

10. 10
- เชื่อมต่ออุปกรณ์ และเครือข่าย
ขั้นตอนนี้เป็นการเชื่อมต่อวงจรที่ใช้ในการ
รับส่งข้อมูลเช่น Numpad, ปุ่มกด, อุปกรณ์รับเหรียญ
และอุปกรณ์รับธนบัตร เข้ากับ IOIO activity board
เพื่อใช้ในการรับส่งข้อมูล และทาการเชื่อมต่อ IOIO กับ
Android Tablet
การเชื่อมต่อระหว่าง Client กับ Server
สามารถเชื่อมต่อโดยใช้ Internet ผ่านวิธีการใดก็ได้ เช่น
GPRS, EDGE, 3G หรือ Wireless ก็สามารถเชื่อมต่อได้
เช่นกัน แต่ต้องคานึงถึง IP Address ของฝั่ง Server ว่าสามารถเข้าถึงได้จากภายนอกหรือไม่เนื่องจาก
การใช้งานต้องใช้การติดต่อระหว่าง Client กับ Server ในการแลกเปลี่ยนข้อมูล และในกรณีที่ต้องการ
ความปลอดภัยในการเชื่อมต่อควรใช้งานผ่านระบบ 3G เนื่องจากพื้นฐานของสถาปัตยกรรมเครือข่ายมี
ความปลอดภัยมากกว่าระบบอื่น
- การติดตั้งและใช้งานระบบ
ติดตั้งอุปกรณ์ทั้งหมดเข้าด้วยกัน ซึ่ง
รายละเอียดของแต่ละอุปกรณ์มีดังนี้ปุ่ม
1) Navigator จะมีสายทั้งหมด 5 สายโดยสายที่ 3
(สายกลาง) ของแต่ละข้างทาหน้าที่เป็น Common
เมื่อกดปุ่มใดๆ แล้วจะได้วงจรปิดที่สาย Common
ออกมาที่สายเส้นที่ปุ่มถูกกด
2) Numpad มีสายทั้งหมด 5 สาย โดยที่จะทาการวนลูปเพื่อหาว่ากด
ปุ่มใดซึ่งแบ่งเป็นแนวตั้งและแนวนอนซึ่งแต่ละแนวมีควบคุมด้วย 4 บิท
Tablet
IOIO
Common
เมื่อกดปุ่มนี้ = 1000|0100

11. 11
รูป 6.เชื่อมต่ออุปกรณ์เข้าด้วยกัน
3) อุปกรณ์รับธนบัตรและเหรียญ ใช้
Output ที่ออกมาจากตัวอุปกรณ์แต่
ละตัวจะถูก Pull-up 5V ด้วยตัว
ต้านทาน 10 KΩ เพื่อให้มี Output
เสถียร โดยอุปกรณ์นี้จะถูกจ่ายไฟฟ้า
แรงดัน 12 V ให้ และจะให้ Oputput
ออกมาในรูปแบบ Pulse โดยที่
อุปกรณ์รับเหรียญจะได้ 1 บาทต่อ 1 Pulse แต่อุปกรณ์รับธนบัตรจะให้ 10 บาทต่อ 1 ลูกคลื่น
และเมื่อเชื่อมต่อ IOIO กับ Android tablet ที่ได้ทาการโหลดโปรแกรมเรียบร้อยและจ่ายไฟให้
ระบบแล้วจะได้ระบบดังภาพ แสดงให้เห็นถึงการพร้อมใช้งานของระบบ และระบบยังมีการส่ง
hashcheck เพื่ออ้างอิงตัวตนมาจากทางฝั่งของ Client โดย Hash นี้เกิดจากการนารหัสประจาเครื่อง
UUID ที่ไม่ซ้ากันในแต่ละเครื่องมาทาการหา hash ด้วย MD5 หนึ่งครั้งและนา MD5 ที่ถูก hash แล้ว
Salt แบบต่อท้าย Cipher text แล้วนาสตริงที่ได้หลังจากการ Salt นั้นไปเช้า hash แบบ SHA-1 อีก
หนึ่งครั้ง เสร็จแล้วจึงส่งไปที่ Server เพื่อยืนยันตัวตน
+12V
GND Output

12. 12
รูป 7.แผนภาพการทางานของ Server
2.3 การดาเนินการของฝั่ง Server
การดาเนินการของฝั่ง Server นั้นเมื่อมีการรับข้อมูลมาจาก Client จะทาการตรวจสอบ
ข้อมูลเบอร์โทรศัพท์ หากมีการคาสั่งที่เกี่ยวกับรายการบัญชีผู้ใช้จึงจะบันทึก Log ลงใน Server
ซึ่งสามารถอธิบายได้ตามแผนภาพดังนี้
1
Server รับข้อมูลจาก Client เข้ามาแล้วทาการบันทึกใช้
งาน Log หรือประวัติการทารายการ หากคาสั่งที่รับผ่าน
WebScoket มานั้นเกี่ยวข้องกับบัญชีเงินคงเหลือในระบบ
ของผู้ใช้
บันทึก Log ลงฐานข้อมูล หรือดึงข้อมูลออกมาแสดงผลตาม
กรณีที่ Client ร้องขอ
>>command
>>doing….
>> Save to DB
USSD
โปรแกรมดาเนินการตามคาร้อง เช่นส่ง USSD โดยใช้
AT Command ออก Serial port เพื่อบอกให้
โทรศัพท์กดปุ่มเติมเงิน
Module โทรศัพท์มือถือจัดการทา
คาสั่งตามที่ถูกร้องขอ เช่น USSD เติม
เงิน / ซื้อบัตรเกม

13. 13
รูป 8. เรียกใช้การทางานของโปรแกรม
รูป 9.รูปแบบของฐานข้อมูล
โดยปกติแล้วก่อนที่ผู้ใช้จะเข้าใช้งานระบบเติมเงินได้นั้นจะต้องได้รับการสร้างบัญชีผู้ใช้งานซึ่งใน
ฐานข้อมูลของโครงการนี้มีโครงสร้างของฐานข้อมูลเพื่อเก็บ Log และบัญชีผู้ใช้ ไว้ในระบบเพิ่มทาการ
เช็คยอดเงินในบัญชีว่ามีเท่าใด และต้องเติมเพิ่มเท่าใด

14. 14
รูป 10.ดึงงินมาแสดง และเติมงิน
จากรูป 9 จะเห็นว่าเมื่อมีการต้องการจะเติมเงินเข้า
เบอร์ 0888888888 ระบบจะเรียกใช้ฐานข้อมูลเพื่อ
สอบถามข้อมูลคงค้างบัญชีว่ามีเหลืออยู่เท่าใด ซึ่งหาก
เป็นบัญชีที่ไม่มีในระบบจะทาการสร้างบัญชีนั้นขึ้นมา
ใหม่โดยอัตโนมัติ และหากมีการใช้งานจนวงเงิน
เปลี่ยนไป ระบบก็จะปรับ Column ชื่อ balance ใน
บัญชีของเบอร์ที่ทารายการให้เป็นค่าใหม่ที่ถูก
ปรับปรุงแล้ว

15. 15
บทที่ 3 : สรุปและข้อเสนอแนะ
3.1 ข้อบกพร่อง หรือข้อจากัดของระบบ
ระบบที่จัดทาขึ้นมีข้อจากัดการใช้งานคือความสามารถชนิดอื่นนอกจากการเติมเงินโทรศัพท์มือถือ
ระบบ AIS ยังไม่สามารถทาสาเร็จ รวมถึงการใช้งานการยืนยันตัวตนในฝั่ง Client โดยใช้ค่าของฟังก์ชัน
hash นั้นกรณีนี้ไม่สามารถสร้างความมั่นใจให้แก่ผู้รับได้เลยว่าถูกส่งมาจากเครื่องของผู้ส่งจริงหรือไม่
ฟังก์ชัน hash เพียงรับรองว่าไม่มีการแก้ไขข้อมูลระหว่างทางเท่านั้น
นอกจากนี้ระบบยังมีความไม่เสถียรเนื่องจากบ่อยครั้งที่พบว่าปุ่มที่กดได้ใน Numpad มีความคลาด
เคลื่อนจากความเป็นจริงที่กด บางครั้งเกิดอาการหน่วงเวลา หากกดปุ่มใดๆ ค้างไว้หรือกดปุ่มถี่ๆ กัน
และหากการเชื่อมต่อ Android tablet กับ IOIO ต่อค้างไว้ก่อนเรียนโปรแกรมอาจเกิดปัญหา Android
tablet ไม่ตรวจจับอุปกรณ์ IOIO
3.2 ข้อเสนอแนะ
เนื่องจากการใช้งานในเชิงพาณิชย์หากต้องการความปลอดภัยที่สูงกว่าควรใช้การงาน SSL (Secure
Socket Layer) โดยผ่าน WebSocket Secure (wss protocol) ที่ได้รับการรับรอง Digital signature
จาก CA แล้วเพื่อทาให้การส่งข้อมูลรับส่งได้อย่างปลอดภัยมากยิ่งขึ้น และควรจะใช้ ROM ของ
Android ที่ถูกดัดแปลงมาโดยเฉพาะและเพื่อป้องกันการไม่ตรวจจับ IOIO ของ Android tablet
3.3 สรุป
การประยุกต์ใช้งานอุปกรณ์ Tablet ร่วมกับการทางานอย่างอื่นพบได้มากในปัจจุบันเนื่องจาก
อุปกรณ์มีราคาที่ลดลง ในขณะที่ประสิทธิภาพสูงขึ้นเรื่อยๆ และยังสามารถเพิ่มคุณสมบัติใหม่ๆได้ง่าย
กว่าเดิมต่างจากที่ใช้การควบคุมโดย Microcontroller ที่ต้องทาการส่งเข้าศูนย์บริการหรือใช้มนุษย์ใน
การติดตั้ง จึงสามารถที่จะแสดงผลการซื้อขายสินค้าในรูปแบบ GUI (Graphic User Interface) ที่
นอกจากจะทาให้การใช้งานสะดวกมากขึ้นแล้ว ยังทาให้การทาธุรกรรมต่างๆง่ายขึ้นได้โดยไม่ต้องมีบัญชี
ธนาคาร และสามารถใช้บริการได้ตลอด 24 ชั่วโมงอีกด้วย

16. 16
บทที่ 4 : บรรณานุกรม
4.1 บรรณานุกรม
- (http://en.wikipedia.org/wiki/WebSocket. 2013)
- ytai. (31 Oct 2010). IOIO Documentation. https://github.com/ytai/ioio/wiki.
- (http://www.robotfreak.de/blog/en/android-en/ioio-robotics-tutorial-1-ultrasonic-
sensor/732.2013)
- (http://developer.android.com/guide/components/index.html.2013)
- Autobahn project. (2013). AutobahnAndroid is an open-source for android library.
http://autobahn.ws/android
- Jiramot Numnam(30 Nov 2008). Send SMS via AT Command by using Java.
http://www.jiramot.info/send-sms-via-at-command-by-using-java