เริ่มต้นใช้งาน

iApp eKYC SDK คือ client แบบโอเพนซอร์ส (Apache-2.0) ใช้ฟรี สำหรับเรียก eKYC API ของ iApp โดยถ่ายบัตรประชาชน หนังสือเดินทาง หรือบัตรราชการจากกล้อง ตรวจ liveness และเปรียบเทียบใบหน้า แล้วเรียก API ให้เอง การเรียก API แต่ละครั้งคิดกับ API key ของคุณในราคาเดียวกับการเรียก API นั้นโดยตรง ซอร์สโค้ดอยู่ที่ github.com/iapp-technology/iapp-ekyc-sdk และทดลองใช้ในเบราว์เซอร์ได้ที่หน้าทดลองกล้องสด

ติดตั้งและถ่ายภาพแรก

รับ API key ได้ที่หน้า การจัดการ API Key บน Flutter และ Web ตัว capture engine ทำงานบนเครื่องผู้ใช้ ส่วน wrapper แบบเนทีฟ สำหรับ iOS, Android และ React Native ใช้ engine ตัวเดียวกันซึ่งโหลดจาก https://iapp.co.th/sdk/webview.html ตอนแอปทำงาน คุณภาพการถ่ายจึงเท่ากันทุกแพลตฟอร์ม และแอปต้องต่ออินเทอร์เน็ต

Flutter

1. ต้องใช้ Flutter ≥ 3.32 และ Dart ≥ 3.8, Android minSdk 24, iOS 15.5 ขึ้นไปพร้อม NSCameraUsageDescription ใน Info.plist (ข้อความขอสิทธิ์ดูได้จากแอป flutter/example ใน repo)
2. เพิ่ม SDK เป็น git dependency ใน pubspec.yaml
3. สร้าง client แล้วถ่ายบัตรประชาชนด้านหน้า

dependencies:
  iapp_ekyc_sdk:
    git:
      url: https://github.com/iapp-technology/iapp-ekyc-sdk.git
      path: flutter

import 'package:iapp_ekyc_sdk/iapp_ekyc_sdk.dart';

final client = IappEkycClient(apiKey: 'YOUR_API_KEY');

final front = await DocumentCaptureView.start(
  context,
  client: client,
  documentType: DocumentType.thaiIdFront,
  locale: EkycLocale.th,
);

Web

1. ใช้เบราว์เซอร์ที่รองรับ WebAssembly และ getUserMedia และเปิดผ่าน HTTPS หรือ localhost เพราะเบราว์เซอร์จะบล็อกกล้องบน origin ที่ไม่ปลอดภัย
2. ติดตั้งแพ็กเกจ
3. สร้าง client แล้วถ่ายบัตรประชาชนด้านหน้า โดย locale เป็น 'en', 'th' หรือ 'zh'

npm install @iapp-technology/ekyc-sdk

import { IappEkyc } from '@iapp-technology/ekyc-sdk';

const ekyc = new IappEkyc({ apiKey: 'YOUR_API_KEY' });

const front = await ekyc.captureDocument({
  mount: document.getElementById('ekyc-mount'),
  documentType: 'thaiIdFront',
  locale: 'th',
});

ถ้าไม่ใช้ bundler ให้โหลด UMD bundle ซึ่งจะสร้าง namespace window.IappEkyc และมีคลาสอยู่ข้างใน:

<script src="https://unpkg.com/@iapp-technology/ekyc-sdk"></script>
<script>
  const ekyc = new window.IappEkyc.IappEkyc({ apiKey: 'YOUR_API_KEY' });
</script>

ไฟล์ของ capture engine จะโหลดเมื่อเริ่ม flow เท่านั้น ถ้า Content Security Policy ของคุณไม่อนุญาตให้โหลดจาก CDN ให้โฮสต์ไฟล์เองแล้วตั้งค่า assetBaseUrl

iOS

1. ต้องใช้ iOS 15 ขึ้นไป และมี NSCameraUsageDescription ใน Info.plist
2. ใน Xcode เลือก File → Add Package Dependencies… ใส่ https://github.com/iapp-technology/iapp-ekyc-sdk แล้วเพิ่ม product IappEkyc
3. เปิด flow

import IappEkyc

let config = IappEkycConfig(apiKey: "YOUR_API_KEY", flow: .documentCapture)
config.documentType = .thaiIdFront
IappEkycSdk.present(from: self, config: config) { result in /* ... */ }

การอ่านผลลัพธ์, liveness และ Objective-C ดูที่ SDK เนทีฟ

Android

1. ต้องใช้ minSdk 24 และ Android System WebView เวอร์ชันล่าสุด (แนะนำ Chrome/WebView ≥ 100)
2. เพิ่ม dependency จาก JitPack
3. ลงทะเบียน contract แล้วเปิด flow

// app/build.gradle.kts — เพิ่ม maven("https://jitpack.io") ใน repositories
dependencies { implementation("com.github.iapp-technology:iapp-ekyc-sdk:v0.2.0") }

val ekyc = registerForActivityResult(IappEkycContract()) { result -> /* ... */ }
ekyc.launch(IappEkycRequest.DocumentCapture(config, EkycDocumentType.THAI_ID_FRONT))

การตั้งค่า, การอ่านผลลัพธ์ และ Java ดูที่ SDK เนทีฟ

React Native

1. ต้องใช้ React Native ≥ 0.72 และ react-native-webview ≥ 13.6
2. ติดตั้งจาก repo ที่ clone มา
3. แสดง flow

git clone https://github.com/iapp-technology/iapp-ekyc-sdk
npm install ./iapp-ekyc-sdk/react-native react-native-webview

<IappEkycFlow flow="documentCapture" documentType="thaiIdFront"
  apiKey="YOUR_API_KEY" onResult={...} onError={...} onCancel={...} />

การขอสิทธิ์กล้องและการเปิดแบบเต็มจอด้วย Modal ดูที่ SDK เนทีฟ

API key

API key ที่ฝังไปกับแอปถูกดึงออกได้ ทั้งจากการ decompile APK และจาก developer tools ของเบราว์เซอร์ ในระบบจริงให้ชี้ SDK ไปที่ backend ของคุณเอง และเก็บ API key ของ iApp ไว้ฝั่งเซิร์ฟเวอร์:

IappEkycClient(apiKey: '', baseUrl: 'https://your-backend.example.com/ekyc')

เมื่อ apiKey เป็นค่าว่าง SDK จะไม่ส่ง header apikey แล้ว backend ของคุณจะแนบ key จริงและส่งต่อไปที่ https://api.iapp.co.th อย่างน้อยควรแยก key ให้แต่ละแอปและจำกัดสิทธิ์ไว้ เพื่อให้ยกเลิก key ที่รั่วได้โดยไม่กระทบแอปอื่น รายละเอียด: SECURITY.md

Flow และราคา

แต่ละ flow เรียก API หนึ่งตัว และคิดราคาตาม API นั้น

• ถ่ายบัตรประชาชน: หาขอบบัตร รอเฟรมที่คมและนิ่ง ปรับมุมให้ตรง แล้วส่งเข้า API ด้านหน้า 1.25 IC ด้านหลัง 0.75 IC
• ถ่ายหนังสือเดินทาง: engine เดียวกัน ปรับให้เข้ากับหน้าข้อมูลของหนังสือเดินทาง (MRZ) 0.75 IC
• ถ่ายบัตรราชการ: ใบขับขี่ สมุดบัญชีธนาคาร และบัตรประชาชนพร้อมลายเซ็น 1.25 IC ต่อหน้า
• Face Active Liveness: ให้ผู้ใช้ทำท่าทางแบบสุ่มโดยตรวจบนเครื่อง เลือกเฟรมที่ดีที่สุด และได้ผลตัดสินที่เซิร์ฟเวอร์ลงนามรับรอง 1 IC
• Face Verification: เปรียบเทียบภาพใบหน้าสองภาพในการเรียกครั้งเดียว 0.3 IC
• Face Passive Liveness: ตรวจการปลอมแปลงจากภาพเดียว 0.3 IC

ธีมและภาษา

ทุกแพลตฟอร์มใช้ธีมสีฟ้าอ่อนเป็นค่าเริ่มต้น และปรับได้ด้วยชื่อ token ชุดเดียวกัน โดย wrapper แบบเนทีฟรับ token ผ่าน config object ข้อความบนหน้าจอมีภาษาอังกฤษ ไทย และจีน: locale: 'th' บน Web, EkycLocale.th บน Flutter, config.locale = .th บน iOS, .locale(EkycLocale.TH) บน Android และ locale="th" บน React Native

Flutter

EkycTheme เป็นคลาส immutable ธรรมดา ไม่ขึ้นกับ Theme.of:

const theme = EkycTheme.lightBlue;             // ค่าเริ่มต้น
final custom = EkycTheme.lightBlue.copyWith(
  primary: Color(0xFF113F7B),
  borderRadius: 12,
);
DocumentCaptureView.start(context, theme: custom, ...);

Web

Token จะถูกตั้งเป็น CSS custom properties บน element ที่ mount:

new IappEkyc({ apiKey, theme: { primary: '#113F7B', borderRadius: 12 } });

/* หรือตั้งค่าใหม่ด้วย CSS ธรรมดา */
#ekyc-mount { --iapp-ekyc-primary: #113f7b; --iapp-ekyc-border-radius: 12px; }

Token และค่าเริ่มต้นของธีม

Token	ค่าเริ่มต้น	ใช้กับ
primary	#0284C7	ปุ่ม, กรอบนำสายตาขณะทำงาน, แถบความคืบหน้า
primaryDark	#0C4A6E	หัวข้อ, ข้อความแนะนำ
primaryLight	#BAE6FD	กรอบนำสายตาขณะรอ, สีเน้นอ่อน ๆ
surface	#F0F9FF	แผ่นพื้นหลัง, ป้ายข้อความแนะนำ
onPrimary	#FFFFFF	ข้อความและไอคอนบนสี primary
success	#22C55E	จับขอบเอกสารได้, ผ่านท่าทางที่สุ่ม
warning	#F59E0B	ถือให้นิ่ง, ภาพเบลอเกินไป
error	#EF4444	เกิดข้อผิดพลาด
overlayScrim	#0C4A6E ที่ 60%	ส่วนที่ทับภาพกล้องนอกกรอบนำสายตา
brandDeep	#113F7B	สีแบรนด์ iApp (ไม่บังคับ)
borderRadius	16	ป้าย, ปุ่ม, การ์ดผลลัพธ์
guideStrokeWidth	3	ความหนาเส้นกรอบนำสายตา
fontFamily	ค่าเริ่มต้นของแพลตฟอร์ม	ตั้งค่าเองได้ (ไม่บังคับ)

รายละเอียดเพิ่มเติม: THEMING.md