嵌入式模式
实现无感支付
实现内嵌到自己的网页中,不脱离当前页面支付
import { embedCheckout } from "@futurepay/checkout-sdk";
// 1. 后端调用接口生成token (推荐)
// 获取session 需要商户自己的后端调用All-In-One Checkout (V2)生成sessionToken
// 获取session文档地址:https://doc.futurepay.global/docs/all-in-one-checkout-v2
const session = await fetch("your/api/session").then((res) => res.json());
const checkoutOptions = {
sessionToken: session,
env: "test", // 'test' | 'prod'
};
// 高度自适应的嵌入式收银台
const checkoutInstance = await embedCheckout("#checkout-container",checkoutOptions);
// 手动销毁
//checkoutInstance.close();// your/api/session的api node示例代码
import { format } from 'date-fns'
//正式环境使用 https://api.futurepay.global 开发环境使用 https://api.futurepay-develop.com
const baseUrl = 'https://api.futurepay-develop.com'
//在商户后台获取
const paymentConfig = {
appKey: 'your appKey',
appID: 'your appID',
merchantID: 'your merchantID',
}
//获取收银台会话
export async function getSession() {
const body = {
amount: {
value: 10000, //金额
currency: 'USD', //币种
},
countryCode: 'US', //货币
reference: '123456789', // 使用您的transactionId 作为唯一 reference
returnUrl: 'https://futurepay.global', //用户交易重定向页面
origin: 'https://futurepay.global', //您的网站地址
productDetail: 'productDetail',
productName: 'productName',
shopImgLink: '', //产品图片 最好传入 在收银台会展示
directReturn: true, //交易成功后是否直接跳转到returnUrl
webhookUrl: `/api/checkout/payment`, //您的webhookUrl地址 交易变动通知
}
const { appKey, appID, merchantID } = paymentConfig
const data = await fetch(baseUrl + '/checkout/newSession', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
appId: appID,
merchantId: merchantID,
curTime: format(new Date(), 'yyyy-MM-dd HH:mm:ss'), //yyyy-MM-dd HH:mm:ss的格式即可 可以使用您自己的时间库
Authorization: SingUtils.getSign(body, appKey), //SingUtils类 请查看文档 https://doc.futurepay.global/reference/api%E8%BA%AB%E4%BB%BD%E9%AA%8C%E8%AF%81 获取签名类
} as HeadersInit,
body: JSON.stringify(body),
}).then((res) => res.json())
//如果使用收银台 请使用sessionToken
return {
sessionToken: data.data.sessionToken,
url: data.data.checkOutUrl,
}
}
单一按钮
(谷歌pay和苹果pay使用嵌入式单一按钮需要域名备案)
单一 卡支付

Updated 13 days ago