الدفع المدمج بالكريبتو: نافذة دفع داخل موقعك
الدفع المدمج بالكريبتو: ادمج نافذة modal أو نموذج مدمج مباشرة عبر JavaScript. إنشاء الدفع على الخادم والمتصفح، التحقق من webhook، تجربة حية.
يعني الدفع المدمج بالكريبتو أن نافذة الدفع تُفتح مباشرة على صفحتك عبر widget JavaScript. يمكن أن تكون نافذة modal (نافذة عائمة) أو نموذج مدمج. توفر Qvard widget جاهزًا للإنتاج على https://qvard.com/checkout.js. يشرح هذا الدليل طريقة عمله وكيفية دمجه.
ماذا يعني الدفع المدمج
الدفع المدمج هو نافذة دفع، غالبًا ما تكون modal، تُفتح فوق الصفحة التي يتواجد فيها العميل. يحتفظ العميل بسياق المتجر ويدفع دون مغادرة الموقع. منطق الدفع يبقى كما في الصفحة المستضافة.
كيفية عمله في Qvard
يُحمّل widget من https://qvard.com/checkout.js ويفتح نافذة الدفع بوضع modal (نافذة منبثقة) أو مدمج. النافذة هي نفس صفحة الدفع في Qvard: يختار العميل الأصل والشبكة، والمبلغ يحدده طلبك. تستقبل نسخة widget مفتاحك العام (qvard_pk_…) لإنشاء الدفع في المتصفح، أو معرّف الدفع لإنشاء الدفع على الخادم. جرّب مباشرة على صفحة التجربة على qvard.com.
طريقتان لإنشاء الدفع
في المتصفح: مرّر المفتاح العام (qvard_pk_…) والمبلغ إلى widget؛ ينشئ الدفع ويفتح النافذة. على الخادم: ينشئ backend الخاص بك الدفع عبر POST /api/v1/payment ويمرّر معرّف الدفع إلى widget. للطلبات بسعر ثابت أو حدود مخزون، استخدم الإنشاء على الخادم حتى لا يتمكن العميل من تغيير السعر في المتصفح. بدلًا من ذلك، تخطّ widget وأعد توجيه العملاء إلى صفحة الدفع المستضافة.
<script src="https://qvard.com/checkout.js"></script>
new QvardCheckout({
mode: 'modal',
publishableKey: 'qvard_pk_…',
price: 10,
onSuccess: function (e) {
console.log('paid', e.paymentId);
}
}).open();x-api-key: qvard_sk_…
{
"id": "order_1024",
"price": 149.99,
"paymentSystemId": 12
}
// 201 Created
{
"data": {
"id": "8f3k2a1c",
"redirectUrl": "https://my.qvard.com/pay/8f3k2a1c"
},
"code": 201,
"message": "success",
"status": true
}على الخادم: أنشئ الدفع أولًا
يرسل خادمك معرّف الطلب والسعر بالدولار مع ترويسة x-api-key. تعيد الاستجابة معرّف الدفعة و redirectUrl. مرّر معرّف الدفع إلى widget في المتصفح، أو استخدم redirectUrl لإعادة توجيه مستضافة. احتفظ بالمفتاح على الخادم، فلا ينبغي إرسال الطلب من المتصفح.
تحقق من الدفع من webhook
عندما تكون الحالة paid يستقبل endpoint الـ webhook الخاص بك المعرّف والحالة، موقّعة برويسة X-Qvard-Signature (HMAC-SHA256). تحقق من التوقيع باستخدام مفتاحك السري (qvard_sk_…) وتأكد من تطابق المبلغ مع طلبك. ضع علامة على الطلب كمدفوع فقط بعد التحقق من التوقيع.
متى تختار النافذة المدمجة
استخدم modal مدمج أو نموذج مدمج للاحتفاظ بالعملاء على صفحتك. صفحة الدفع المستضافة بإعادة توجيه تعمل بشكل متساوٍ وهي خيار إذا فضّلت عدم دمج نافذة الدفع. يشترك كلا النهجين في نفس API و webhook.
FAQ
هل الدفع المدمج بالكريبتو متاح في Qvard اليوم؟
نعم. حمّل widget من https://qvard.com/checkout.js ومرّر مفتاحك العام (qvard_pk_…) لإنشاء الدفع في المتصفح، أو أنشئ الدفع على الخادم ومرّر معرّفه.
كيف أضيف widget إلى موقعي؟
أضف وسم <script src="https://qvard.com/checkout.js"></script> وأنشئ نسخة QvardCheckout بمفتاحك والمبلغ والوضع (modal أو مدمج). انظر إلى أمثلة الأكواد في هذا المقال وفي التجربة الحية.
هل توقيع الدفع مهم؟
نعم. تحقق دائمًا من رويسة X-Qvard-Signature في webhook الخاص بك باستخدام مفتاحك السري، وتأكد من تطابق المبلغ في webhook مع طلبك.
هل يمكنني استخدام إعادة التوجيه بدلًا من النافذة المدمجة؟
نعم. صفحة الدفع المستضافة على redirectUrl تعمل بشكل متساوٍ ولا تتطلب widget. يستخدم كلا النهجين نفس API و webhook.
