Touch 'n Go NEW

หัวข้อทั้งหมดในหน้านี้

รับชำระเงินออนไลน์จากผู้ใช้ Touch 'n Go ผ่านทางเว็บไซต์ของคุณ โดยเปิดใช้ช่องทางรับชำระเงิน Touch 'n Go

ในคู่มือแนะนำการใช้งานนี้จะอธิบายขั้นตอนการชำระเงิน และรายละเอียดวิธีการติดตั้งเพื่อใช้งาน

การเปิดรับชำระเงิน

  • ประเทศที่รองรับ: สิงคโปร์, ประเทศไทย
  • API เวอร์ชันล่าสุดที่รองรับ: 2017-11-02

ร้านค้าที่ต้องการเปิดใช้ระบบ Touch 'n Go กรุณาส่งอีเมลมาที่ support@opn.ooo

Payment flow

Touch 'n Go รองรับการชำระเงินผ่านแอปพลิเคชันมือถือและเว็บไซต์ โดยขั้นตอนการชำระเงินผ่าน Touch 'n Go จะเป็นแบบ app_redirect  ซึ่งหมายความว่า ระบบจะส่งผู้ซื้อไปยังหน้าชำระเงินที่ปลอดภัยของ Touch 'n Go เพื่อให้ผู้ซื้ออนุมัติและยืนยันการทำรายการ สำหรับผู้ซื้อที่ใช้งานโทรศัพท์มือถือสามารถชำระเงินผ่านแอปพลิเคชัน Touch 'n Go ได้เลย ส่วนผู้ซื้อที่ต้องการชำระเงินผ่านทางเว็บไซต์จะต้องสแกนคิวอาร์โค้ดผ่านแอปพลิเคชัน Touch 'n Go บนมือถือ หรือล็อกอินเข้าบัญชี Touch 'n Go เพื่อยืนยันการชำระเงิน โดยตัวอย่างภาพหน้าจอนี้จะแสดงขั้นตอนการชำระเงินที่แบ่งออกเป็น 2 รูปแบบ ได้แก่ การสแกนคิวอาร์บนคอมพิวเตอร์ และการสแกนคิวอาร์โค้ดบนมือถือ

Using a mobile

Wallet App ❶ เมื่อผู้ซื้อเลือกวอลเล็ตที่จะใช้ชำระเงิน ❷ ระบบจะส่งผู้ซื้อไปที่แอปพลิเคชันของวอลเล็ต เพื่อยืนยันการทำรายการ ❸ ผู้ซื้อจะได้เห็นรายละเอียดข้อมูลการชำระเงินทั้งหมด ❹ ผู้ซื้อสามารถเลือก กลับไปยังร้านค้า เพื่อยืนยันการทำรายการที่หน้าชำระเงินของร้านค้าได้

Using a desktop browser

Payment Flow3 ❶ เมื่อผู้ซื้อเลือกวอลเล็ตที่จะใช้ชำระเงิน ❷ จะมีคิวอาร์โค้ดปรากฎขึ้นมา ❸ ผู้ซื้อเปิดใช้ที่สแกนคิวอาร์ในแอปพลิเคชันวอลเล็ต ❹ ผู้ซื้อสแกนคิวอาร์โค้ด ❺ ระบบจะสรุปข้อมูลการชำระเงินให้ผู้ซื้อ ก่อนยืนยันการทำรายการ ❻ จากนั้นระบบจะแสดงสลิปยืนยันการทำรายการ ซึ่งทางผู้ซื้อสามารถเลือก กลับไปยังร้านค้า เพื่อยืนยันการทำรายการที่หน้าชำระเงินของร้านค้าได้ ➐ เมื่อการชำระเงินสำเร็จแล้ว ทางร้านค้าจะได้รับการแจ้งเตือนผ่าน webhook เพื่อยืนยันการทำรายการกับผู้ซื้อ

การติดตั้งใช้งาน

ในการสร้างรายการรับชำระเงินผ่านTouch 'n Go ให้ร้านค้าส่งคำสั่ง API ดังนี้

  1. สร้าง payment source (type: touch_n_go) โดยใช้ Omise.js, omise-ios หรือ omise-android
  2. สร้าง charge โดยใช้ source จากขั้นตอนแรก
  3. เมื่อผู้ซื้อทำรายการสำเร็จและร้านค้าได้รับ webhook event หรือ charge.complete แล้ว เราแนะนำให้ตรวจสอบสถานะรายการด้วยตนเองอีกครั้งเพื่อความแม่นยำ

การสร้าง source เพื่อรับชำระเงินผ่านTouch 'n Go จะเกิดขึ้นในฝั่งของผู้ซื้อ (client-side) เช่นบนเว็บไซต์หรือโทรศัพท์มือถือของผู้ซื้อ ร้านค้าจะต้องใช้ public key

ส่วนการสร้างรายการ (charge) เพื่อรับชำระเงินผ่านTouch 'n Go จะเกิดขึ้นในฝั่งของร้านค้า (server-side) ร้านค้าจะต้องใช้ secret key

หมายเหตุ: หากมีความจำต้องสร้างทั้งรายการและ source ในฝั่งร้านค้า (server-side) สามารถทำพร้อมกันได้เลยโดยการส่งคำสั่ง API เพียงครั้งเดียว และใช้งาน secret key

การสร้าง source


เมื่อผู้ซื้อเลือกชำระเงินผ่านช่องทางนี้ ให้ร้านค้าสร้าง source ผ่าน source API โดยกำหนด amount, currency, platform_type, และ type

Parameter Type Description
amount integer (required) See Limits
currency string (required) Currency for source as three-letter ISO 4217 code (SGD for Singapore, THB for Thailand)
platform_type string (optional) Platform the payer is making payment on, iOS ANDROID or WEB
type string (required) touch_n_go

ตัวอย่างด้านล่างนี้เป็นการสร้าง source สำหรับรายการ Touch 'n Go จำนวน S$1500 ให้แทนค่าของ omise_public_key และ $OMISE_PUBLIC_KEY ด้วย test public key ของร้านค้าซึ่งสามารถคัดลอกได้จาก แดชบอร์ด

หากใช้ Omise.js parameter type เป็นตัวแปรที่จำเป็นของฟังก์ชัน createSource

Omise.setPublicKey(omise_public_key);

Omise.createSource('touch_n_go', {
  "amount": 150000,
  "currency": "SGD",
  "platform_type": "WEB"
}, function(statusCode, response) {
  console.log(response)
});

หากร้านค้าต้องการทดสอบให้สร้าง request โดยใช้ curl

curl https://api.omise.co/sources \
  -u $OMISE_PUBLIC_KEY: \
  -d "amount=150000" \
  -d "currency=SGD" \
  -d "type=touch_n_go" \
  -d "platform_type=WEB"
{
  "object": "source",
  "id": "src_test_5w441c0ci4v8ca7g8kb",
  "livemode": false,
  "location": "/sources/src_test_5w441c0ci4v8ca7g8kb",
  "amount": 150000,
  "barcode": null,
  "bank": null,
  "created_at": "2023-06-15T02:25:45Z",
  "currency": "SGD",
  "email": null,
  "flow": "app_redirect",
  "installment_term": null,
  "absorption_type": null,
  "name": null,
  "mobile_number": null,
  "phone_number": null,
  "platform_type": "WEB",
  "scannable_code": null,
  "billing": null,
  "shipping": null,
  "items": [],
  "references": null,
  "store_id": null,
  "store_name": null,
  "terminal_id": null,
  "type": "touch_n_go",
  "zero_interest_installments": null,
  "charge_status": "unknown",
  "receipt_amount": null,
  "discounts": []
}

ตัวแปรของ id คือ source identifier (เริ่มต้นด้วย src)

การสร้างรายการรับชำระเงิน

สร้างรายการรับชำระเงินโดยระบุ parameter return_uri, source, amount และ currency

  • return_uri จะเป็นตำแหน่งบนเว็บไซต์ของร้านค้าที่ผู้ซื้อจะถูกส่งไปเมื่อยืนยันรายการสำเร็จ
  • source จะเป็นตัวกำหนด source identifier
  • amount และ currency จะต้องมีค่าตรงกับ amount และ currency ของ source > return_uri ต้องเป็น HTTPS ฟอร์แมต.

ตัวอย่างด้านล่างนี้แสดงการสร้างรายการรับชำระเงินผ่าน ขึ้นใหม่โดยใช้ curl

ในการสร้างรายการให้ร้านค้าแทน $OMISE_SECRET_KEY ด้วย test secret key ของร้านค้าซึ่งสามารถคัดลอกได้จากแดชบอร์ด และแทน $SOURCE_ID ด้วย id ของ source

curl https://api.omise.co/charges \
  -u $OMISE_SECRET_KEY: \
  -d "amount=150000" \
  -d "currency=SGD" \
  -d "return_uri=https://example.com/orders/345678/complete" \
  -d "source=$SOURCE_ID"
{
  "object": "charge",
  "id": "chrg_test_5w441c35t3fc0vplo8k",
  "location": "/charges/chrg_test_5w441c35t3fc0vplo8k",
  "amount": 150000,
  "net": 145650,
  "fee": 4350,
  "fee_vat": 0,
  "interest": 0,
  "interest_vat": 0,
  "funding_amount": 150000,
  "refunded_amount": 0,
  "transaction_fees": {
    "fee_flat": "0.0",
    "fee_rate": "2.9",
    "vat_rate": "0.0"
  },
  "platform_fee": {
    "fixed": null,
    "amount": null,
    "percentage": null
  },
  "currency": "SGD",
  "funding_currency": "SGD",
  "ip": null,
  "refunds": {
    "object": "list",
    "data": [],
    "limit": 20,
    "offset": 0,
    "total": 0,
    "location": "/charges/chrg_test_5w441c35t3fc0vplo8k/refunds",
    "order": "chronological",
    "from": "1970-01-01T00:00:00Z",
    "to": "2023-06-15T02:25:45Z"
  },
  "link": null,
  "description": null,
  "metadata": {},
  "card": null,
  "source": {
    "object": "source",
    "id": "src_test_5w441bseqp79jfmtyzj",
    "livemode": false,
    "location": "/sources/src_test_5w441bseqp79jfmtyzj",
    "amount": 150000,
    "barcode": null,
    "bank": null,
    "created_at": "2023-06-15T02:25:44Z",
    "currency": "SGD",
    "email": null,
    "flow": "app_redirect",
    "installment_term": null,
    "absorption_type": null,
    "name": null,
    "mobile_number": null,
    "phone_number": null,
    "platform_type": "WEB",
    "scannable_code": null,
    "billing": null,
    "shipping": null,
    "items": [],
    "references": null,
    "store_id": null,
    "store_name": null,
    "terminal_id": null,
    "type": "touch_n_go",
    "zero_interest_installments": null,
    "charge_status": "pending",
    "receipt_amount": null,
    "discounts": []
  },
  "schedule": null,
  "customer": null,
  "dispute": null,
  "transaction": null,
  "failure_code": null,
  "failure_message": null,
  "status": "pending",
  "authorize_uri": "https://pay.omise.co/payments/pay2_test_5w441c376sxzgx0yd5b/authorize",
  "return_uri": "https://example.com/orders/345678/complete",
  "created_at": "2023-06-15T02:25:45Z",
  "paid_at": null,
  "expires_at": "2023-06-22T02:25:45Z",
  "expired_at": null,
  "reversed_at": null,
  "zero_interest_installments": false,
  "branch": null,
  "terminal": null,
  "device": null,
  "authorized": false,
  "capturable": false,
  "capture": true,
  "disputable": false,
  "livemode": false,
  "refundable": false,
  "reversed": false,
  "reversible": false,
  "voided": false,
  "paid": false,
  "expired": false
}

การสร้าง source และรายการรับชำระเงิน

ร้านค้าสามารถสร้างทั้ง source และ รายการรับชำระเงิน (charge) ผ่านการเรียกใช้ API เพียงครั้งเดียว

curl https://api.omise.co/charges \
  -u $OMISE_SECRET_KEY: \
  -d "amount=150000" \
  -d "currency=SGD" \
  -d "return_uri=https://example.com/orders/345678/complete" \
  -d "source[type]=touch_n_go" \
  -d "source[platform_type]=WEB"

สร้างรายการสำเร็จ

เมื่อร้านค้าสร้างรายการรับชำระเงินขึ้นมาแล้ว จะพบว่าสถานะของรายการแสดงเป็น pending หรือ status==pending โดยสถานะของรายการรับชำระเงินสามารถเป็นได้ทั้ง successful, failed และ expired

ในส่วนต่อไปเราจะอธิบายวิธีอนุมัติรายการ, การรับ event แจ้งเตือนเมื่อรายการเสร็จสิ้นผ่าน webhook และการตรวจสอบสถานะรายการ

ภาพด้านล่างนี้แสดงให้เห็นถึงขั้นตอนทั้งหมดในการรับชำระเงินแต่ละรายการ

sequenceDiagram participant customer participant omise.js participant merchant participant api.omise.co customer->>omise.js: Send payment details for purchase omise.js->>api.omise.co: Request source using payment details api.omise.co-->>omise.js: Return source omise.js->>merchant: Merchant gets returned source merchant->>api.omise.co: Request charge using source and purchase details api.omise.co-xmerchant: Send "charge.create" webhook api.omise.co-->>merchant: Return charge merchant->>customer: Redirect to "authorize_uri" for pending charge customer->>api.omise.co: Provide charge authorization details at "authorize_uri" api.omise.co-->>customer: Redirect to "return_uri" api.omise.co-xmerchant: Send "charge.complete" webhook merchant-xcustomer: Send charge result (e.g. via email)

การอนุมัติรายการรับชำระเงิน

ระบบจะส่งผู้ซื้อไปยังตำแหน่งที่ระบุไว้ใน authorize_uri เพื่อให้ผู้ซื้อสามารถดำเนินการอนุมัติรายการรับชำระเงินได้

ร้านค้าสามารถจำลองขั้นตอนการอนุมัติรายการในโหมดทดสอบ โดยเข้าไปที่ authorize_uri เพื่อปรับสถานะรายการเป็น “สำเร็จ” หรือ “ไม่สำเร็จ” ได้ด้วยตนเอง หลังจากผู้ซื้อทำการอนุมัติรายการเสร็จสิ้น ผู้ซื้อจะถูกส่งไปยังหน้าที่ร้านค้าระบุเป็น return_uri เอาไว้

การรับ event แจ้งเตือนรายการสำเร็จ

ร้านค้าสามารถรับการแจ้งเตือนเมื่อมีการทำรายการเสร็จสิ้นโดยใช้งาน webhook events

ในการติดตั้งให้ร้านค้ากำหนดตำแหน่งบนเซิร์ฟเวอร์เพื่อรับ webhook events และเพิ่มตำแหน่งเดียวกันนี้เป็น webhook endpoint บนแดชบอร์ด

เมื่อมีรายการเสร็จสิ้น ระบบจะส่ง POST request ไปยัง endpoint นี้ พร้อมทั้งแนบสถานะการตอบกลับของรายการนั้นๆ ไปด้วย

ตัวแปรหลักหรือ key สำหรับ event object ประกอบไปด้วย charge.complete และตัวแปร data ที่มี charge object

อ่านเพิ่มเติมได้ที่ Events API

การตรวจสอบสถานะรายการ

เมื่อได้รับ event ของรายการที่เสร็จสิ้นแล้ว ร้านค้าสามารถตรวจสอบสถานะรายการหรือ status โดยใช้ Charge API

หากค่าของ charge.status เป็น successful หมายถึงว่ารายการรับชำระเงินสำเร็จ หากค่าของ charge.status เป็น failed รายการรับชำระเงินนั้นไม่สำเร็จ ร้านค้าสามารถตรวจสอบ failure_code และ failure_message ได้ใน charge object เพื่ออ่านคำอธิบายเพิ่มเติม

สาเหตุขัดข้องที่อาจเกิดขึ้นได้มีดังนี้

รหัสข้อขัดข้อง รายละเอียด
payment_expired รายการชำระเงินหมดอายุ
payment_rejected รายการถูกปฏิเสธโดยธนาคารผู้ออกบัตร
failed_processing ระบบทำรายการไม่สำเร็จ
invalid_account ไม่พบบัญชีที่สามารถชำระเงินผ่านช่องทางที่เลือก
insufficient_fund วงเงินคงเหลือไม่เพียงพอหรือวงเงินเต็ม

ดูวิธีการยกเลิกรายการและคืนเงินได้ที่ Refunds API documentation รายการชำระเงินผ่าน Touch 'n Go สามารถทำการคืนเงินได้ภายในเวลา 00:15 น. (GMT+8) ของวันถัดไป

ข้อจำกัด

Singapore

  • จำนวนรับชำระขั้นต่ำ: 100 (SGD 1.00)
  • จำนวนรับชำระสูงสุด: 2000000 (SGD 20,000.00)

Thailand

  • จำนวนรับชำระขั้นต่ำ: 2000 (THB 20.00)
  • จำนวนรับชำระสูงสุด: 15000000 (THB 150,000.00)

ขั้นตอนต่อไป

เว็ปไซต์นี้มีการใช้คุกกี้เพื่อวิเคราะห์การใช้และปรับการใช้งานให้เหมาะกับท่าน เมื่อกดยอมรับหรือยังคงเข้าชมเว็บไซต์ต่อ เราถือว่าท่านยินยอมในการใช้งานคุกกี้ของเว็บไซต์ อ่านนโยบายความเป็นส่วนตัว