支付接口自定義參數 - 幫助中心

本文檔詳細介紹軟代系統支付接口嘅自定義參數配置，幫你實現個性化嘅支付體驗。通過這些參數，你可以自定義支付語言、支付方式、優惠碼自動應用等功能。

快速開始

喺你嘅網站中嵌入軟代支付系統只需兩步：

1. 引入 JS 代碼

喺頁面嘅 <head> 或 <body> 結束前添加以下代碼：

HTML

<!-- 配置商户信息 -->
<script>
window.Apsdai = Object.assign(window.Apsdai || {}, { 
    name: 'your_merchant_code'  // 替換為你嘅商戶唯一編碼
});
</script>

<!-- 引入軟代 JS -->
<script src="https://i-cdn.softscdn.com/apsdai.min.js"></script>

2. 添加支付按鈕

喺需要觸發支付嘅元素上添加 data-apsdai-checkout 屬性：

HTML

<button data-apsdai-checkout="your_product_path">立即購買</button>

獲取商戶編碼

登入軟代商戶後台，進入「設置」→「配置」→「查看示例」即可複製你嘅專屬 JS 代碼。

全局配置參數

通過 window.Apsdai 對象可以配置全局參數：

參數	類型	必填	說明
`name`	String	是*	中國站商戶唯一編碼（中國站必填）
`hk_name`	String	是*	香港站/國際站商戶唯一編碼（國際站必填）
`host_site`	String	否	默認站點，可選 `cn`（中國站）或 `hk`（香港站）。默認為 `cn`
`language`	String	否	界面語言，可選 `zh-cn`（簡體中文）、`zh-tw`（繁體中文）、`en`（英文）。默認根據瀏覽器語言自動設置
`open_type`	String	否	打開窗口類型，可選 `pay`（支付）或 `cart`（購物車）。默認為 `pay`

JavaScript

<script>
window.Apsdai = Object.assign(window.Apsdai || {}, {
    name: "your_cn_merchant_code",      // 中國站商戶編碼
    hk_name: "your_hk_merchant_code",   // 國際站商戶編碼
    host_site: "cn",                     // 默認使用中國站
    language: "zh-cn",                   // 默認簡體中文
    open_type: "pay"                     // 默認打開支付窗口
});
</script>

工單系統配置

軟代系統內置工單功能，可以喺頁面右下角顯示工單入口，方便用戶提交問題。通過 work_order 對象進行配置：

參數	類型	說明
`open`	Number	`1` 顯示工單入口，`2` 隱藏（可通過 API 打開）
`theme_color`	String	主題顏色，如 `#16B8F3`
`icon`	String	角標圖片 URL
`icon_width`	String	角標寬度（像素）
`icon_height`	String	角標高度（像素）
`icon_right`	String	角標距離窗口右邊距離（像素）
`icon_bottom`	String	角標距離窗口底部距離（像素）
`header`	String	工單窗口頭部文字
`title`	String	工單窗口標題
`description`	String	工單窗口說明文字
`copyright`	String	版權信息
`collect_info`	Array	需要收集嘅額外信息字段

JavaScript

<script>
window.Apsdai = Object.assign(window.Apsdai || {}, {
    name: "your_merchant_code",
    work_order: {
        open: 1,                          // 顯示工單入口
        theme_color: "#16B8F3",           // 主題顏色
        icon: "https://example.com/icon.png",
        icon_width: "55",
        icon_height: "55",
        icon_right: "40",
        icon_bottom: "40",
        header: "客服支援",
        title: "提交工單",
        description: "⚡️ 我們將盡快為你解決問題！",
        copyright: "Powered by APSDAI",
        collect_info: [
            { name: "手機號" },
            { name: "訂單號" }
        ]
    }
});
</script>

手動打開工單

當 open 設置為 2 時，可以通過調用 ApsdaiInstance().openTickets() 方法手動打開工單窗口。

HTML 屬性參數

除了全局配置，你也可以喺 HTML 元素上使用 data-* 屬性來配置單個支付按鈕嘅行為：

屬性	說明	可選值
`data-apsdai-checkout`	商品 PATH（必填）	商品嘅唯一標識路徑
`data-apsdai-language`	指定支付界面語言	`zh-cn`（簡體）、`zh-tw`（繁體）、`en`（英文）
`data-apsdai-pay`	指定支付方式	`weChat` - 微信支付 `pWeChat` - 服務商微信支付 `alipay` - 支付寶 `pAlipay` - 服務商支付寶 `paypal` - PayPal `stripe` - 信用卡 `shouMoneyBaUnionPay` - 雲閃付
`data-apsdai-coupon`	自動應用優惠碼	優惠碼字符串
`data-apsdai-open-type`	打開窗口類型	`pay`（支付）、`cart`（購物車）
`data-apsdai-site`	指定支付站點	`cn`（中國站）、`hk`（香港站/國際站）

使用示例

HTML

<!-- 基礎支付按鈕 -->
<button data-apsdai-checkout="product_path">立即購買</button>

<!-- 指定簡體中文界面 -->
<button data-apsdai-checkout="product_path" data-apsdai-language="zh-cn">
    中文支付
</button>

<!-- 指定支付寶支付 -->
<button data-apsdai-checkout="product_path" data-apsdai-pay="alipay">
    支付寶付款
</button>

<!-- 自動應用優惠碼 -->
<button data-apsdai-checkout="product_path" data-apsdai-coupon="SAVE20">
    使用優惠碼購買
</button>

<!-- 打開購物車 -->
<button data-apsdai-checkout="product_path" data-apsdai-open-type="cart">
    加入購物車
</button>

<!-- 國際站支付 -->
<button data-apsdai-checkout="product_path" data-apsdai-site="hk">
    International Payment
</button>

多站點配置

如果你同時使用中國站和國際站，可以配置多站點支援：

HTML

<!-- 配置雙站點 -->
<script>
window.Apsdai = Object.assign(window.Apsdai || {}, { 
    name: 'cn_merchant_code',      // 中國站編碼
    hk_name: 'hk_merchant_code',   // 國際站編碼
    host_site: 'cn'                // 默認使用中國站
});
</script>
<script src="https://i-cdn.softscdn.com/apsdai.min.js"></script>

<!-- 中國站支付按鈕 -->
<button data-apsdai-checkout="product" data-apsdai-site="cn">
    國內支付
</button>

<!-- 國際站支付按鈕 -->
<button data-apsdai-checkout="product" data-apsdai-site="hk">
    International Payment
</button>

注意

未指定 data-apsdai-site 屬性時，將使用 window.Apsdai.host_site 配置嘅默認站點。

完整示例

以下係一個完整嘅集成示例，包含全局配置、工單系統和多種支付按鈕：

HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>我嘅軟件商店</title>
</head>
<body>
    <h1>專業版軟件</h1>
    <p>價格：￥99</p>
    
    <!-- 支付按鈕 -->
    <button data-apsdai-checkout="pro-software">立即購買</button>
    
    <!-- 帶優惠碼嘅按鈕 -->
    <button data-apsdai-checkout="pro-software" data-apsdai-coupon="WELCOME10">
        新用戶優惠購買
    </button>

    <!-- 軟代系統配置 -->
    <script>
    window.Apsdai = Object.assign(window.Apsdai || {}, {
        name: 'your_merchant_code',
        language: 'zh-cn',
        work_order: {
            open: 1,
            theme_color: "#16B8F3",
            icon_width: "55",
            icon_height: "55",
            icon_right: "40",
            icon_bottom: "40",
            header: "客服",
            title: "需要幫助？",
            description: "我們隨時為你服務！"
        }
    });
    </script>
    <script src="https://i-cdn.softscdn.com/apsdai.min.js"></script>
</body>
</html>

URL 參數方式

你也可以通過 URL 哈希參數快速指定商品：

URL

# 喺訪問 URL 添加 #apsdai-xxx ( xxx 代碼 path 值 )
https://www.yoursite.com#apsdai-xxx

返回幫助中心