I try to integrate Paypal as a payment method. When the User clicks on "checkout", it should be able that the user click's on 'direct to paypal' to do the express checkout. Or going the "normal" way, entering his shipping data and clicks on the last page "pay with paypal"
I follow the Paypal REST API documentation and the express checkout works fine. But I didn't get the "normal" checkout to run.
The problem isn't in the backend. So all backend operations (create payment, accept payment, etc.) running well.
But in the frontend I'm getting errors.
My Code for the Express checkout is:
<script type="text/javascript" src="https://www.paypalobjects.com/api/checkout.js?ver=4.6.1">
//....
if (jQuery('#paypal_express_btn_div').length > 0) {
paypal.Button.render({
env: 'sandbox'
payment: function(resolve, reject) {
var orderId = jQuery("#orderPostId").val();
// Set up the payment here, when the buyer clicks on the button
var CREATE_PAYMENT_URL = ajaxObject.ajaxURL;
paypal.request.post(
CREATE_PAYMENT_URL,
{
action: 'create_paypal_payment',
orderId: orderId,
}
)
.then(function(data) {
resolve(data.paymentID);
})
.catch(function(err) {
reject(err);
});
},
onAuthorize: function(data, actions) {
//After the reload, a confirm page will be shown
window.location = data.returnUrl;
},
onCancel: function(data, actions) {
return actions.redirect();
},
}, '#paypal_express_btn_div');
}
As I said, this works well. When the user clicks the button, the method "create_paypal_payment" runs on the backend. The payment get's created and when the payment is created, the paypal window get's shown to the user. Now he can confirm the payment by clicking "next". Then (after the page reload) a confim page is shown to the user (with all payment and shipping data) and when he clicks "confirm payment" everything is fine.
But now I try to do the payment at the end of the order. (So the user has entered his shipping data etc.)
The first steps running well. So I can create the payment in the backend. But now I'm getting an error when I try to run the payment execute method in the "onAuthorize" Action. My method "executePayPerPayPalBasic" will not be executed. I'm getting directly an error.
My Code:
if (jQuery("#paypal_btn_div").length > 0) {
var RS_IB_PAYMENT_URL = ajaxObject.ajaxURL;
paypal.Button.render({
env: 'sandbox'
commit: true, //button "pay now" in the paypal window
payment: function(resolve, reject) {
var orderId = jQuery("orderPostId").val();
// Set up the payment here, when the buyer clicks on the button
paypal.request.post(
RS_IB_PAYMENT_URL,
{
action: 'create_paypal_payment',
orderId: orderId,
}
)
.then(function(data) {
resolve(data.paymentID);
})
.catch(function(err) {
reject(err);
});
},
onAuthorize: function(data, actions) {
// Execute the payment here, when the buyer approves the transaction
var payerID = data.payerID;
var paymentID = data.paymentID;
var paymentToken = data.paymentToken;
var returnUrl = data.returnUrl;
paypal.request.post(
RS_IB_PAYMENT_URL,
{
action: 'executePayPerPayPalBasic',
orderId: orderId,
payerID: payerID,
paymentID: paymentID,
paymentToken: paymentToken,
returnUrl: returnUrl
}
)
.then(function(data) {
var paypallink = data.data["PERMALINK"];
window.location = paypallink;
})
.catch(function(err) {
reject(err);
});
}
}, '#paypal_btn_div');
}
The error:
"Error: window.paypal<["./node_modules/post-robot/src/drivers/receive/types.js"]/exports.RECEIVE_MESSAGE_TYPES<@https://www.paypalobjects.com/api/checkout.js:3319:40 receiveMessage@https://www.paypalobjects.com/api/checkout.js:1444:13 messageListener@https://www.paypalobjects.com/api/checkout.js:1462:13 "
Another strange thing is, as I understand, normaly the "commit" parameter should handle if the paypal button is "pay now" or "next". Because of this, I'm not set the parameter in my express checkout (because I want the "next" button) and setting the parameter to true in my normal checkout. But since I used the commit Parameter 1 time. I always getting the "pay now" button. Even in my Express Checkout Button. I have tried to set the parameter to false manually. But it doensn't work.
I tried this with Firefox, Google Chrome and Microsoft Edge. The error only occurs on Firefox. In Google Chrome and Microsoft Edge it works like a charm.
But on each of these three Browsers the Button Text has the Text "pay now" and never shows "next".
Also, all payments are marked as Paypal Express Payments. Is there any Parameter to check my second code als 'normal' payment. Or is it normal, that when I do the payment with the checkout.js all payments are marked as Express Payment?
Where is my failure? Can anybody help me?