共计 1401 个字符，预计需要花费 4 分钟才能阅读完成。
简介
Smart Payment Buttons（智能支付按钮），是全球著名在线支付商PayPal提供的一项最新收款功能，其目的是尽可能多的消除结账中产生的摩擦（checkout friction），即：影响买家完成支付的不利因素。
其集成图如下
可以看到，Smart Payment Buttons已经将 paypal 和信用卡支付集成到了页面中，实际上是在 js 中做了封装，点击不同的支付类型，调用不同的支付。在付款时，浏览器会在当前结账页面弹出一个小窗口来引导用户完成支付，这样用户就无需离开当前的购物页面。和之前的付款方式相比，这应该也是一个改进。
付款流程
- You add the PayPal Smart Payment Buttons to your web page.
- Your buyer clicks the button.
- The button calls PayPal Orders API to set up a transaction.
- The button launches the PayPal Checkout experience.
- The buyer approves the payment.
- The button calls PayPal Orders API to finalize the transaction.
- You show a confirmation to your buyer.
整个付款过程都在 js 中调用完成
整合到代码中
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>
<body>
<script
src="https://www.paypal.com/sdk/js?client-id=SB_CLIENT_ID">
</script>
</body>注：SB_CLIENT_ID是自己在 PayPal 账户中创建 APP 时获取的client_id，默认sb。
js写入
<script>
paypal.Buttons({
// 创建 PayPal 订单
createOrder: function(data, actions) {
return actions.order.create({
purchase_units: [{
amount: {value: '0.01'}
}]
});
},
// 用户授权并支付后调用
onApprove: function(data, actions) {
//
return actions.order.capture().then(function(details) {alert('Transaction completed by' + details.payer.name.given_name);
// Call your server to save the transaction
return fetch('/paypal-transaction-complete', {
method: 'post',
headers: {'content-type': 'application/json'},
body: JSON.stringify({orderID: data.orderID})
});
});
}
}).render('#paypal-button-container');
</script>时间关系，先保存，晚上继续补全
正文完
发表至： javascript
2019-05-18
