Menu
I thought that it would be an easy 2 line integration as seen here. But after adding the correct CSP in order to allow in line executions, the behavior is not as intended. The window pops up and closes immediately.
Here is my popup.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"]
}
926
that is just initializing the SDK. You have to do a few things:
client-id=sb with your own client id. https://developer.paypal.com/docs/api/overview/#get-credentials
create an empty <div> and reference this div by id in the render() method
Add the appropriate callback functions to create and complete an order.
ex.
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/#
Thanks!
54
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
