paypal支付，官網
例項
引入cdn
在載入該元件時就讀取指令碼
data() {
return {
clientId:'AbJmdo6IqMHBMfgJVP-qWfFacVBBDOE45hOJGp8_XpZ1uq4ytOzOPDX4jw2p0pUTPmNptRA40BEqgdXf', // paypal客戶端id
};
},
mounted() {
this.initScript()
},
methods: {
// 載入paypal指令碼
initScript(){
const setLoaded = ()=>{
// console.log('初始化--載入script')
}
// 在頁面中建立script標籤
const script = document.createElement("script");
// 給script標籤加src 連結到paypal
// script.src = "https://www.paypal.com/sdk/js?client-id=YOU_CLIENT_id";
// 測試連線 沙盒
// script.src = "https://www.paypal.com/sdk/js?client-id=test&components=buttons,marks";
script.src = `https://www.paypal.com/sdk/js?client-id=${this.clientId}`;
script.addEventListener("load", setLoaded);
document.body.appendChild(script);
}
}
渲染生成元素元件
透過監聽變化，再初始化渲染元件
<div ref="paypalBtnBox"></div>watch: {
visible: {
handler(val, oldVal) {
this.popupStatus = val;
if (val) {
this.paypalResultStatus = false;
if (window.paypal) {
// console.log("已載入---");
let _this = this;
this.$nextTick(() => {
_this.initPaypal(_this);
});
} else {
// console.log("未載入---");
}
}
},
deep: true,
immediate: true,
},
},
methods: {
// 初始化paypal元件
async initPaypal(_this) {
_this.$refs.paypalBtnBox.innerHTML = ''; // 清空元素內容
window.paypal
.Buttons({
style: {
layout: 'vertical',//按鈕樣式
color: 'gold',//顏色
shape: 'pill',//
label: 'checkout',//按鈕文字
tagline: false //
},
// locale: 'zh_CN',//按鈕的語言
async createOrder() {
// 建立
try {
//建立訂單xgemBuyPaypal
const response = await xgemBuyPaypal(_this.paypalOrder)
.then((resp) => {
_this.paypalRespond = resp?.data;
// console.log("--paypal---resp", _this.paypalRespond);
return _this.paypalRespond;
})
.catch((err) => {
_this.$notice.error(err);
return Promise.reject(err);
});
const orderData = await response;
if (orderData?.payPalOrderId) {
return orderData?.payPalOrderId;
} else {
const errorDetail = orderData?.details?.[0];
const errorMessage = errorDetail
? `${errorDetail.issue} ${errorDetail.description} (${orderData.debug_id})`
: JSON.stringify(orderData);
throw new Error(errorMessage);
}
} catch (err) {
_this.$notice.error(err);
}
},
async onApprove(data, actions) {
// 使用者支付回撥
await actions.order.capture()
.then((details) => {
// 支付成功
let orderNumber,orderAmount;
// 訂單id
orderNumber = details.id;
//訂單支付的金額
orderAmount = details.purchase_units[0].amount.value;
_this.goResultPage(true)
// console.log('支付成功---1-',details, orderNumber,orderAmount);
}).catch((err)=>{
//支付失敗
_this.goResultPage(false)
// console.log('支付失敗----',err)
});
_this.paypalApprove(_this,data,actions)
},
onCancel: function(data) {
// 在付款取消時執行的操作
// console.log('在付款取消時執行的操作---',data)
},
onClick: function(data) {
// 在點選支付按鈕時執行的操作
// console.log('在點選支付按鈕時執行的操作---',data)
},
})
.render(_this.$refs.paypalBtnBox);
},
}
完整程式碼
引用
<PaypalPop
:visible="PaypalPopupStatus"
:paypal-order="paypalOrderParams"
@closeEvent="showPaypalPopEvent"
@success="paymentSuccess">
</PaypalPop>PaypalPop.vue
檢視程式碼
<template>
<div>
<Popup
class="popup-paypal"
:closeable="paypalResultStatus?false:true"
v-model="popupStatus"
get-container="body"
:close-on-click-overlay="false"
:position="bottomOrCenter"
@click.stop
@close="handleClose(1)"
>
<div class="paypal-button-container-box" v-if="!paypalResultStatus">
<div ref="paypalBtnBox"></div>
</div>
<PaypalResult v-else :atype="paypalResultType" @closeEvent="handleClose(2)"></PaypalResult>
</Popup>
</div>
</template>
<script>
import { reportOrderNFTPaypal } from "@/api/http.account";
import { xgemBuyPaypal } from "@/api/nft/http.nft";
import { Popup } from "vant";
import PaypalResult from "@/components/PaypalResult.vue";
export default {
name: "Paypal",
components: {
Popup,
PaypalResult,
},
props: {
paypalOrder: Object,
visible: Boolean,
},
// paypalOrder
data() {
return {
popupStatus: this.visible,
paypalRespond: null, // paypal建立訂單後的回撥
reportOrder: null, // 上報的訂單
bottomOrCenter: "bottom",
paypalResultStatus: false, // 是否顯示結果
paypalResultType: false, // 結果狀態
clientId:'AbJmdo6IqMHBMfgJVP-qWfFacVBBDOE45hOJGp8_XpZ1uq4ytOzOPDX4jw2p0pUTPmNptRA40BEqgdXf', // paypal客戶端id
};
},
watch: {
visible: {
handler(val, oldVal) {
this.popupStatus = val;
if (val) {
this.paypalResultStatus = false;
if (window.paypal) {
// console.log("已載入---");
let _this = this;
this.$nextTick(() => {
_this.initPaypal(_this);
});
} else {
this.$notice.error(this.$t('fomo.FOMO_EGAIN'));
// console.log("未載入---");
}
}
},
deep: true,
immediate: true,
},
},
created() {
},
mounted() {
this.initScript()
},
methods: {
//關閉當前彈窗,val:1為右上角的關閉 2為結果頁的關閉
handleClose(val) {
this.popupStatus = false;
this.$emit("closeEvent", val); //傳送給子類 自定義方法
return;
},
// 透過是判斷paypal支付結果
// this.goResultPage(true) this.goResultPage(false);
goResultPage(_type) {
this.paypalResultStatus = true;
this.paypalResultType = _type;
},
// paypal結果上報
async paypalReport(_this) {
//上報介面引數
const paramsReport = {
id: _this.paypalRespond?.id, // 外部支付訂單ID
payPalOrderId: _this.paypalRespond?.payPalOrderId, // PayPal Order ID
result: _this.paypalResultType?1:2, // 支付結果：1-成功；2-取消
};
// console.log("上報的引數---", paramsReport);
await reportOrderNFTPaypal(paramsReport)
.then((resp) => {
// console.log("上報結果--", resp);
_this.reportOrder = resp?.data;
_this.handleClose(2)
_this.$emit('success');
return _this.reportOrder;
})
.catch((err) => {
// this.$notice.error(_this.$t('order_paypal_Report_fail',{var1:'Paypal'}));
this.$notice.error(_this.$t('account.order_payment_wait'));
});
},
// 初始化paypal元件
async initPaypal(_this) {
_this.$refs.paypalBtnBox.innerHTML = ''; // 清空元素內容
window.paypal
.Buttons({
style: {
layout: 'vertical',//按鈕樣式
color: 'gold',//顏色
shape: 'pill',//
label: 'checkout',//按鈕文字
tagline: false //
},
// locale: 'zh_CN',//按鈕的語言
async createOrder() {
// 建立
try {
//建立訂單xgemBuyPaypal
const response = await xgemBuyPaypal(_this.paypalOrder)
.then((resp) => {
_this.paypalRespond = resp?.data;
// console.log("--paypal---resp", _this.paypalRespond);
return _this.paypalRespond;
})
.catch((err) => {
_this.$notice.error(err);
return Promise.reject(err);
});
const orderData = await response;
if (orderData?.payPalOrderId) {
return orderData?.payPalOrderId;
} else {
const errorDetail = orderData?.details?.[0];
const errorMessage = errorDetail
? `${errorDetail.issue} ${errorDetail.description} (${orderData.debug_id})`
: JSON.stringify(orderData);
throw new Error(errorMessage);
}
} catch (err) {
_this.$notice.error(err);
}
},
async onApprove(data, actions) {
// 使用者支付回撥
await actions.order.capture()
.then((details) => {
// 支付成功
let orderNumber,orderAmount;
// 訂單id
orderNumber = details.id;
//訂單支付的金額
orderAmount = details.purchase_units[0].amount.value;
_this.goResultPage(true)
// console.log('支付成功---1-',details, orderNumber,orderAmount);
}).catch((err)=>{
//支付失敗
_this.goResultPage(false)
// console.log('支付失敗----',err)
});
_this.paypalApprove(_this,data,actions)
},
onCancel: function(data) {
// 在付款取消時執行的操作
// console.log('在付款取消時執行的操作---',data)
},
onClick: function(data) {
// 在點選支付按鈕時執行的操作
// console.log('在點選支付按鈕時執行的操作---',data)
},
})
.render(_this.$refs.paypalBtnBox);
},
// paypal支付狀態回撥
async paypalApprove(_this,data,actions){
// console.log("paypal回撥---", data, "-----", actions);
try {
const response = _this.paypalReport(_this);
const orderData = await response;
} catch (error) {
console.error(error);
}
},
// 載入paypal指令碼
initScript(){
const setLoaded = ()=>{
// console.log('初始化--載入script')
}
// 在頁面中建立script標籤
const script = document.createElement("script");
// 給script標籤加src 連結到paypal
// script.src = "https://www.paypal.com/sdk/js?client-id=YOU_CLIENT_id";
// 測試連線 沙盒
// script.src = "https://www.paypal.com/sdk/js?client-id=test&components=buttons,marks";
script.src = `https://www.paypal.com/sdk/js?client-id=${this.clientId}`;
script.addEventListener("load", setLoaded);
document.body.appendChild(script);
}
},
};
</script>
<style lang="scss" scoped >
.popup-paypal{
display: flex;
justify-content: center;
align-items: center;
padding: 50px 0;
}
.paypal-button-container-box{
width: 70%;
}
</style>
PaypalResult.vue
檢視程式碼
<template>
<div>
<div style="font-size: 20px; margin:60px 20px; text-align: center;">
<img v-if="showBtn" style="width:46px;" src="data:image/png;base64,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" alt="" />
<img v-else style="width:46px;" src="data:image/png;base64,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" />
<p style="font-size:20px;color:#3F3F3F;">{{showBtn?'Success':'Failed'}}</p>
<ButtonAsync class="btn-hollow" :async="closeWindow"> {{ $t("common.message_done") }}</ButtonAsync>
</div>
</div>
</template>
<script>
import ButtonAsync from "@/components/ButtonAsync";
export default {
name: "PaypalResult",
components: {
ButtonAsync,
},
props: {
atype: Boolean,
},
data() {
return {
showBtn: false,// 成功失敗
};
},
watch: {
atype: {
handler(val, oldVal) {
this.showBtn = val;
},
deep: true,
immediate: true,
},
},
created() {
},
async mounted() {
},
methods: {
closeWindow(){
this.showBtn = false;
this.$emit("closeEvent", this.showBtn); //傳送給子類 自定義方法
return Promise.resolve();
},
},
};
</script>
<style lang="scss" scoped >
.btn-base{
margin-top: 20px;
width: 100%;
}
</style>
參考vue3接入paypal
https://perper.top/700/.html