码迷,mamicode.com
首页 > 其他好文 > 详细

paypal 智能支付 按钮

时间:2020-09-24 21:01:38      阅读:64      评论:0      收藏:0      [点我收藏+]

标签:you   VID   rgba   anti   one   custom   inter   tail   phone   

<!DOCTYPE html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Ensures optimal rendering on mobile devices. -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- Optimal Internet Explorer compatibility -->
    <script src="https://www.paypal.com/sdk/js?client-id=client_id&currency=EUR"></script>
</head>
 
<body>
<div id="paypal-button-container"></div>
 
<script>
/*
1. client_id 账号的客户端ID,需要自己注册。
2. currency 币种,默认是USD。
2. paypal.Buttons 参数以及使用。 https://developer.paypal.com/docs/checkout/integration-features/
3. 显示的按钮是根据一系列因素自动决定的,包括:买方国家,设备类型,买家选择查看的资金来源。
4. 要阻止某些按钮显示参考 https://developer.paypal.com/docs/checkout/reference/customize-sdk/#disable-funding
*/
 
let purchase_units_amount = {
    currency_code: "EUR",
    value: "8.00",
    breakdown: {
        item_total: {
            value: "10.00",
            currency_code: "EUR"
        },
        discount: {
            value: "2.00",
            currency_code: "EUR"
        },
    }
}
 
let purchase_units_item_list = [
    {
        name: "NeoPhone",
        sku: "sku03",
        unit_amount: {
            value: "5.00",
            currency_code: "EUR"
        },
        quantity: "1"
    },
    {
        name: "Fitness Watch",
        sku: "sku04",
        unit_amount: {
            value: "5.00",
            currency_code: "EUR"
        },
        quantity: "1"
    }
]
 
let purchase_units_shipping_address = {
    "address_line_1": "123 Townsend St",
    "address_line_2": "Floor 6",
    "admin_area_2": "San Francisco",
    "admin_area_1": "CA",
    "postal_code": "94107",
    "country_code": "US"
};
 
 
paypal.Buttons({
    // 配置付款按钮 https://developer.paypal.com/docs/checkout/integration-features/customize-button/
    style: {
        layout: vertical, // 布局方式:vertical: 垂直,horizontal:水平,
        color: gold,
        shape: rect,
        label: paypal
    },
    //返回顾客在paypal上选择的地址,具体用法参考 https://developer.paypal.com/docs/checkout/integration-features/shipping-callback/
    onShippingChange: (data, actions)=>{
        console.log("onShippingChange", data, actions);
    },
    // 按钮第一次呈现时调用
    onInit: ()=>{
        console.log("onInit");
    },
    // 点击付款按钮时调用 通常用于表单验证
    onClick: ()=>{
        console.log("onClick");
        return true;
    },
    createOrder: (data, actions)=>{
        // 参考链接:https://developer.paypal.com/docs/api/orders/v2/#orders_patch
        return actions.order.create({
            purchase_units: [{
                amount: purchase_units_amount,
                shipping: {
                    address: purchase_units_shipping_address
                },
                items: purchase_units_item_list
            }],
            application_context: {
                brand_name: "LilySilk",
                shipping_preference: "SET_PROVIDED_ADDRESS", // GET_FROM_FILE / NO_SHIPPING / SET_PROVIDED_ADDRESS
                user_action: "PAY_NOW"
            }
        });
    },
    onApprove: (data, actions)=>{
        return actions.order.capture().then((details)=>{
            console.log("capture", details);
        });
    },
    onCancel: (data)=>{
        console.log("onCancel", data);
    },
    onError: (err)=>{
        // 参考资料:https://developer.paypal.com/docs/api/orders/v2/#orders_patch
        console.log("onError", err);
    }
}).render(#paypal-button-container);
</script>
</body>

原:https://blog.csdn.net/Gx422954766/article/details/103953144

paypal 智能支付 按钮

标签:you   VID   rgba   anti   one   custom   inter   tail   phone   

原文地址:https://www.cnblogs.com/dream-meng/p/13716254.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!