我认为这将是一个简单的 2 行集成，如图所示。但是，在添加正确的 CSP 以允许行执行后，行为不符合预期。窗口弹出并立即关闭。
这是我的弹出窗口.html
<html>
<head>
<title>Quick Launcher</title>
<link rel="stylesheet" href="style.css" />
<script src="https://www.paypal.com/sdk/js?client-id=sb"></script>
</head>
<body>
<h1>My chrome</h1>
<script>paypal.Buttons().render('body');</script>
</body>
</html>
manifest.json
{
"manifest_version": 2,
"name": "Quick Launcher",
"description": "Smart links organizer. Create collection of related links or add urls of different environments(uat, prod) of various deployed apps",
"version": "1.2.10",
"icons": {
},
"browser_action": {
"default_icon": {
},
"default_popup": "popup.html"
},
"content_security_policy": "script-src 'self' https://www.paypal.com 'sha256-U2vsCzUQ797LcHkgCQJsOSAJxY/+LTdJONJ+wacPXrI='; object-src 'self' https://www.paypal.com 'sha256-U2vsCzUQ797LcHkgCQJsOSAJxY/+LTdJONJ+wacPXrI='; script-src-elem 'self' https://www.paypal.com 'sha256-U2vsCzUQ797LcHkgCQJsOSAJxY/+LTdJONJ+wacPXrI='",
"background": {
"scripts": [
"background.js"
]
},
"permissions": ["tabs", "activeTab"]
}
这只是初始化SDK。您必须做几件事：
- 将
client-id=sb替换为您自己的客户端 ID。
https://developer.paypal.com/docs/api/overview/#get-credentials
-
创建一个空
<div>并在 render(( 方法中通过 id 引用此div -
添加相应的回调函数以创建和完成订单。
前任。
paypal.Buttons({
createOrder: function(data, actions) {
// This function sets up the details of the transaction, including the amount and line item details.
return actions.order.create({
purchase_units: [{
amount: {
value: '0.01'
}
}]
});
},
onApprove: function(data, actions) {
// This function captures the funds from the transaction.
return actions.order.capture().then(function(details) {
// This function shows a transaction success message to your buyer.
alert('Transaction completed by ' + details.payer.name.given_name);
});
}
}).render('#paypal-button-container');
//This function displays Smart Payment Buttons on your web page.
https://developer.paypal.com/docs/checkout/integrate/#
谢谢！