คู่มือแนะนำทีละขั้นตอน (Step-by-Step) จำนวน 32 ขั้นตอน พร้อมภาพประกอบจริงบนอุปกรณ์ Android ตั้งแต่การดาวน์โหลดไฟล์ APK, การปลดล็อกสิทธิ์ความปลอดภัย, การลงทะเบียน License, การเชื่อมต่อเครื่องอ่านบัตร ตลอดจนการทดสอบเชื่อมต่ออ่านบัตรประชาชนจริงผ่าน Deep Link และ HTTP REST API
💡 หมายเหตุ: Deep Link Callback URL ไม่จำเป็นต้องตั้งค่าก็ได้ หากไม่ได้ใช้งาน หรือใช้งานระบบเชื่อมต่อผ่านโหมด Web HTTP REST API
ขั้นตอนที่ 01 – 08: การดาวน์โหลดไฟล์ APK บน Android และการอนุญาตติดตั้งแอปจากแหล่งภายนอก
เปิดเบราว์เซอร์ Google Chrome บนอุปกรณ์ Android เข้าสู่หน้าเว็บไซต์ดาวน์โหลด จากนั้นแตะที่ปุ่มสีน้ำเงิน "ดาวน์โหลด APK สำหรับ Android"
🔍 แตะเพื่อดูภาพเต็ม
เบราว์เซอร์จะแสดงหน้าต่างยืนยัน "ดาวน์โหลดจากเว็บไซต์นี้ไหม ตรวจสอบว่าคุณเชื่อถือ r2.naipon.dev ได้" ให้กดปุ่ม "ดาวน์โหลด"
🔍 แตะเพื่อดูภาพเต็ม
เมื่อดาวน์โหลดไฟล์เรียบร้อย แถบแจ้งเตือนด้านบนจะแสดงข้อความ "การดาวน์โหลด 1 รายการเสร็จสมบูรณ์ (smartcard_agent.apk)" ให้กดปุ่ม "เปิด" (Open)
🔍 แตะเพื่อดูภาพเต็ม
ในหน้าต่างระบบ "เปิดด้วย" ให้แตะเลือก "โปรแกรมติดตั้งแพ็กเกจ" (Package Installer) จากนั้นเลือกแตะ "เฉพาะครั้งนี้"
🔍 แตะเพื่อดูภาพเต็ม
เนื่องจากเป็นการติดตั้งไฟล์ภายนอก Google Play ระบบจะแจ้งเตือนความปลอดภัย "โทรศัพท์ของคุณไม่ได้รับอนุญาตให้ติดตั้งแอปที่ไม่รู้จักจากแหล่งที่มานี้" ให้แตะ "การตั้งค่า" (Settings)
🔍 แตะเพื่อดูภาพเต็ม
ในหน้า "ติดตั้งแอปที่ไม่รู้จัก" ให้แตะเปิดสวิตช์ "ให้การอนุญาต" สำหรับ Chrome จากนั้นหน้าต่างระบบจะถามยืนยัน ให้กดปุ่ม "ติดตั้ง" (Install)
🔍 แตะเพื่อดูภาพเต็ม
หากระบบ Android หรือระบบความปลอดภัยของตัวเครื่องแสดงหน้าต่าง "ไม่แนะนำให้ติดตั้งแอปนี้" ให้แตะเลือกที่ปุ่ม "ติดตั้งอยู่ดี" (Install anyway) เพื่อดำเนินการต่อ
🔍 แตะเพื่อดูภาพเต็ม
เมื่อระบบดำเนินการเสร็จสมบูรณ์ จะแสดงข้อความ "ติดตั้งแอปแล้ว" ให้แตะปุ่ม "เปิด" (Open) เพื่อเข้าสู่แอป Thai ID Smart Card Agent
🔍 แตะเพื่อดูภาพเต็ม
ขั้นตอนที่ 09 – 15: ลงทะเบียน License Key 16 หลัก, เสียบเครื่องอ่าน USB และทดสอบอ่านบัตร (Test Read)
เมื่อเปิดแอป Smart Card Agent ขึ้นมา ให้สังเกตที่แถบเมนูด้านบนขวา แล้วแตะที่ไอคอนข้อมูล (ℹ️ Info) เพื่อเข้าสู่หน้าจัดการ License
🔍 แตะเพื่อดูภาพเต็ม
ในหน้าต่าง "About & Licensing" ในช่อง License Key (16 Characters) ให้กรอกรหัสใบอนุญาตที่ได้รับ (เช่น 1234-5678-90AB-CDEF) แล้วกดปุ่ม "Activate License"
🔍 แตะเพื่อดูภาพเต็ม
ระบบจะตรวจสอบและแสดงกล่องข้อความ "เปิดใช้งานสำเร็จ License ได้รับการเปิดใช้งานและเริ่มระบบบริการ Smart Card Agent บนอุปกรณ์นี้เรียบร้อยแล้ว" ให้แตะปุ่ม "OK"
🔍 แตะเพื่อดูภาพเต็ม
หน้าต่างจะแสดงสถานะสีเขียว "License Active (เปิดใช้งานแล้ว)" พร้อมรายการฟีเจอร์ที่เปิดใช้งาน ได้แก่ DEEP_LINK, HTTP, HTTPS ให้กดปุ่ม "Close" เพื่อปิดหน้าต่าง
🔍 แตะเพื่อดูภาพเต็ม
นำเครื่องอ่านบัตร (USB CCID เช่น SCM SCR3310) เสียบเข้าช่อง USB/OTG ของแท็บเล็ต เมื่อมีป๊อปอัปถามสิทธิ์ ให้ติ๊กเลือก "เปิด Smart Card Agent ทุกครั้งเมื่อเชื่อมต่อกับ..." แล้วกดปุ่ม "ตกลง"
🔍 แตะเพื่อดูภาพเต็ม
ตรวจสอบว่าหน้าจอแสดงเครื่องอ่านบัตรเชื่อมต่อแล้ว จากนั้นเสียบบัตรประชาชนเข้าไปในเครื่องอ่าน ระบบจะแสดงสถานะ "Card Inserted (INSERTED)" ให้กดปุ่ม "Test Read"
🔍 แตะเพื่อดูภาพเต็ม
หน้าต่าง "Thai National ID Card" จะแสดงผลข้อมูลที่อ่านได้จากชิปการ์ดจริง เช่น เลขประจำตัวประชาชน, ชื่อ-นามสกุล, วันเกิด, ที่อยู่ และรูปถ่ายใบหน้าความละเอียดสูง เมื่อตรวจสอบเสร็จให้กด "Close"
🔍 แตะเพื่อดูภาพเต็ม
ขั้นตอนที่ 16 – 18: การเปลี่ยนชื่อจุดบริการ (Agent Name) และการกำหนด Deep Link Callback URL
ที่แถบเมนูด้านบนของแอป แตะที่ไอคอนรูปฟันเฟือง (⚙️ Settings) เพื่อเปิดหน้าต่าง "Agent Configuration"
🔍 แตะเพื่อดูภาพเต็ม
1. Agent Name: เปลี่ยนชื่อเป็นจุดบริการของท่าน เช่น Outpatient Kiosk 1
2. Deep Link Callback URL: กรอก URL สำหรับทดสอบ https://smartcardagent.naipon.dev/idcard/callback
3. กดปุ่ม "Save" เพื่อบันทึกค่า
🔍 แตะเพื่อดูภาพเต็ม
เมื่อบันทึกแล้ว หน้าหลักจะแสดงชื่อใหม่ในส่วน Agent Service ทันที เช่น ID: 019881c8bf1a0684 (Outpatient Kiosk 1) พร้อมรองรับการเชื่อมต่อจากภายนอก
🔍 แตะเพื่อดูภาพเต็ม
ขั้นตอนที่ 19 – 21: การสั่งเปิดแอปผ่าน URL Scheme บนเว็บ และการรับข้อมูลกลับผ่าน Server-Sent Events (SSE)
เปิดเบราว์เซอร์เข้าสู่ smartcardagent.naipon.dev เลือกแท็บ "Mode 1: Deep Link" ติ๊กถูกที่ช่อง "ดึงรูปถ่ายด้วย (Photo)" แล้วกดปุ่ม "เริ่มต้นขออ่านบัตร (New Request)"
🔍 แตะเพื่อดูภาพเต็ม
หน้าเว็บจะสร้างเซสชันคำขออ่านบัตร ให้แตะปุ่มสีเขียว "แตะเพื่อเปิดแอป (บนเครื่องเดียวกัน)" (URL Scheme: smartcard-agent://read?...) เบราว์เซอร์จะสลับเปิดเข้าแอป Smart Card Agent เพื่อเริ่มอ่านบัตรทันที
🔍 แตะเพื่อดูภาพเต็ม
เมื่อแอปพลิเคชันอ่านข้อมูลจากบัตรประชาชนเสร็จสิ้น ข้อมูลและรูปถ่ายจะถูกส่งกลับมาแสดงผลบนหน้าเว็บทันที แสดงสถานะสีเขียว "ได้รับข้อมูลบัตรเรียบร้อยแล้ว (Deep Link (SSE))" พร้อมข้อมูลหน้าบัตรครบถ้วน
🔍 แตะเพื่อดูภาพเต็ม
ขั้นตอนที่ 22 – 32: การเชื่อมต่อผ่าน Local IP, การยืนยันรหัส PIN 8 หลักเพื่อความปลอดภัย และการสั่งอ่านบัตรผ่าน API
บนหน้าเว็บทดสอบ ให้แตะเลือกแท็บ "Mode 2: Web HTTP Agent" จากนั้นในส่วนรูปแบบการเรียก API ให้เลือกตัวเลือก "Direct Agent (ยิงตรงเข้า Agent)"
🔍 แตะเพื่อดูภาพเต็ม
กรอก Agent Endpoint URL เป็น IP และ Port ของแท็บเล็ต เช่น http://192.168.31.35:8765 (หรือสามารถใช้ http://localhost:8765 ได้หากเปิดหน้าเว็บทดสอบบนอุปกรณ์เครื่องเดียวกัน) จากนั้นกดปุ่ม "ตรวจสอบการเชื่อมต่อ (Check Agent)" เมื่อพบระบบจะแสดงเครื่องหมายถูกสีเขียว "พบ Agent: Outpatient Kiosk 1"
🔍 แตะเพื่อดูภาพเต็ม
เลื่อนลงมาที่ขั้นตอนที่ 2 "จับคู่ความปลอดภัย (Pairing)" ให้กดปุ่มสีน้ำเงิน "ขอรหัสจับคู่ (Request Pairing PIN)" เพื่อส่งคำขอรับรหัส PIN ยืนยันสิทธิ์ไปยังหน้าจอแท็บเล็ต
🔍 แตะเพื่อดูภาพเต็ม
หน้าเว็บจะแสดงเลขอ้างอิงคำขอ พร้อมเวลานับถอยหลัง 2 นาที และช่องสำหรับ "กรอก PIN 8 หลัก (จากหน้าจอแท็บเล็ต)"
🔍 แตะเพื่อดูภาพเต็ม
บนหน้าจอแอป Smart Card Agent ของแท็บเล็ต จะมีหน้าต่างป๊อปอัป "New Pairing Request" แสดงชื่อ Web Client, IP ที่ขอเชื่อมต่อ และรหัสตัวเลข 8 หลัก (เช่น 6549 5609)
🔍 แตะเพื่อดูภาพเต็ม
นำรหัส PIN 8 หลักที่เห็นบนแท็บเล็ตมากรอกลงในช่องบนหน้าเว็บให้ครบถ้วน (ตัวอย่าง: 65495609) จากนั้นกดปุ่มสีเขียว "ยืนยันรหัส PIN"
🔍 แตะเพื่อดูภาพเต็ม
หน้าเว็บจะแสดงสถานะ "จับคู่สำเร็จ (Authenticated)" พร้อมได้รับ Access Token เรียบร้อย และปลดล็อกขั้นตอนที่ 3 "สั่งอ่านบัตรประชาชน (Card Operations)" พร้อมใช้งานทันที
🔍 แตะเพื่อดูภาพเต็ม
สลับกลับมาดูที่หน้าจอแท็บเล็ต ในการ์ด Web Client Session จะอัปเดตเป็น "1 Client Paired (1 active session authorized)" โดยสามารถแตะปุ่ม "Manage" เพื่อจัดการเซสชันได้
🔍 แตะเพื่อดูภาพเต็ม
หน้าต่าง "Paired Web Clients" จะแสดงรายชื่อเว็บแอปพลิเคชันที่จับคู่ไว้ พร้อม IP Address และวันเวลาที่เชื่อมต่อ ผู้ดูแลระบบสามารถกดปุ่ม "Revoke" เพื่อเพิกถอนสิทธิ์การอ่านบัตรได้ทันทีทุกเมื่อ จากนั้นแตะ "Close"
🔍 แตะเพื่อดูภาพเต็ม
กลับมาที่หน้าเว็บ ขั้นตอนที่ 3 "สั่งอ่านบัตรประชาชน" ตรวจสอบว่าเสียบบัตรประชาชนแล้ว ติ๊กถูกที่ช่อง "อ่านรูปถ่าย (Photo)" จากนั้นกดปุ่มสีน้ำเงิน "สั่งอ่านบัตรทันที (POST /card/read)"
🔍 แตะเพื่อดูภาพเต็ม
หน้าเว็บจะแสดงสถานะสีเขียว "อ่านข้อมูลบัตรผ่าน HTTP สำเร็จ!" พร้อมแสดงรายละเอียดข้อมูลหน้าบัตรประชาชนและรูปถ่ายใบหน้าความละเอียดสูงอย่างสมบูรณ์แบบ ยืนยันการเชื่อมต่อและพร้อมนำไปใช้งานจริงในระบบงานต่างๆ
🔍 แตะเพื่อดูภาพเต็ม