Paypal adaptive payment not working in mobile

Ale_mark
Contributor
Contributor

I'm trying to set a paypal adaptive payment flow to create a Chained payment. After many troubles the desktop version of my payment works correctly, it sends payment to all the receivers and it redirect correctly to my site. My problem now is in real mobile browsers ( setting user agent of my desktop browser solve all the problems, but this naturally it isn't the real mobile user experience). This is my code :

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Paypal test</title>
</head>

<body>
<!--MINI-->
<script src="https://www.paypalobjects.com/js/external/apdg.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">

    //this function register the order in my system
    function saveOrder() {

                //call an internal api to get the paypal api key for this transaction                $.ajax({                  url: "http://www.example.com/ajax/getPayKey.php",                  success: function(datakey) {                       arrData = datakey.split("|");
                       var paykey=arrData[0];

                       //with the obtained api key i set the value of the hidden field in the form                       $("#paykey").val(paykey);

                  }

                });




    }   


    var returnFromPayPal = function(){

        // returning from paypal flow i need to know the transaction status to redirect the user to the correct page in my site        $.ajax({              url: "<?php echo URL_SITO; ?>/ajax/PaymentDetails.php?pay_key="+ $("#paykey").val(),              success: function(data_return) {

                 //with the url returned i redirect user                 document.location.href=data_return;
              }

            });

    }

    //init the paypal flow 
    var dgFlowMini = new PAYPAL.apps.DGFlowMini({trigger: 'submitBtn', expType: 'mini', callbackFunction: 'returnFromPayPal'});

</script>

<!--Start pay key process-->
<div onclick="saveOrder();">Pay Order</div>

<form action="https://www.sandbox.paypal.com/webapps/adaptivepayment/flow/pay" target="PPDGFrame" class="standard" id="paypal_form_adaptive">
    <!--Start payment flow-->
    <input type="image" id="submitBtn" value="Pay with PayPal" src="https://www.paypalobjects.com/en_US/i/btn/btn_paynowCC_LG.gif">
    <input id="type" type="hidden" name="expType" value="mini">
    <input id="paykey" type="hidden" name="paykey" value="insert_pay_key">
</form>
</body>
</html>


 

I have read in paypal documentation that i can use three types of flow for an adaptive payments, i have found problems with all this flow types. I have choose the "mini" options beacause it is the nearest to solution. Anyway, with the code above i mostly complete the flow, the "mini" open a new tab in my Iphone, i complete the payment but the redirect is wrong. Paypal returns in my payment page but the callbackFunction: 'returnFromPayPal' is never called. Without callback i can't redirect user.

How i can do to complete correctly this flow on mobile?

 

Login to Me Too
5 REPLIES 5

MTS_Ciaran
Moderator
Moderator

How do.... Welcome to the community. 

 

So with Adaptive Payments, there is no dedicated mobile flow as you know, the other checkout flows can work, but the most stable is the desktop/full version on mobile devices. The mini browser flow works depending on the device type, but technically the mini browser does not support mobile browsers. It was specifically designed for a small pop up checkout on a desktop/full browser. 

 

Can you tell me what type of checkout flow you want, I mean what type of business are you setting up to use chained payments. We might be able to provide advice around a different solution. 

Login to Me Too

Ale_mark
Contributor
Contributor

Hi and thanks for the answer.

I have to create a chained payment flow, 1 sender and 2 receivers (a primary and a secondary), the flow will be something like:

sender buy an item -> it pays the primary receveri -> the primary pays a percentage to secondary receiver (the web-app owner).

This is my business kind and as you can see it's a simply chained flow and it works correctly in deskotp version.

 

What is the flow tecnhically to achive my business type?

 

sender buy an item -> i call the first api to create the payment and retrive a paykey -> with paykey i send a form to instantiate a mini browser flow -> sender complete payment in mini browser -> mini browser return and launch a callback js function-> in callback js function i call another paypal api to get payment details -> analizing the payment details i know if the transaction is completed or not -> if transaction is completed i have to redirect user to a specific page on my site, if transaction isn't completed i have to redirect the user to another page.

 

In desktop this solution works correctly with mini browser option. In mobile i have used mini browser, but i'm opened to any other solution that respect the flow above.

Login to Me Too

Ale_mark
Contributor
Contributor

MTS_Ciaran
Moderator
Moderator

So there is no chained payment type solution at the moment out side adapative Payments, the nearest solution is to use EC parallel Payments. But this means buyers will see two transactions on their account, but you do get the mobile optimized checkout flow. 

 

The other option is to stick with the flow you have which is not optimized, but gives you the chained function

Login to Me Too

Ale_mark
Contributor
Contributor

Thanks for the answer @MTS_Ciaran, i can't consider EC parallel Payments as an option, it's something different from what i wanna achive. Anyway i have also problems with the standard flow (no mini, no lightbox) in mobile environment.

To create a "standard flow" i redirect users to this address:

 

https://www.sandbox.paypal.com/webscr?cmd=_ap-payment&paykey=APxxxxxxx

 

//this function register the order in my system
    function saveOrder() {

                //call an internal api to get the paypal api key for this transaction                $.ajax({                  url: "http://www.example.com/ajax/getPayKey.php",                  success: function(datakey) {                       arrData = datakey.split("|");
                       var paykey=arrData[0];

                       //with the obtained api key i set the value of the hidden field in the form
$("#paykey").val(paykey);

//redirect to flow payment
var url_redirect=arrData[2];
                                     alert(url_redirect);
                                     document.location.href=url_redirect;
} }); }

 

 

It is the address that return from the api i call to create the paykey. This time the problem it's a little bit different. In my iphone's safari with a cleared cache i can't complete the payment process. I can complete the process only in this way:

 

buyer click the pay button-> i call the paypal api to retrive the paykey and the redirect url -> after redirect the payment flow start -> buyer does the login in paypal sandbox -> buyer clicks on pay button -> the paypal loader remain in screen forever, without complete the payment -> buyer click back on the browser history until he arrives in the checkout page of my site , the point when he start the payment flow -> he restart all the process -> this time i can complete the payment process, with a successful redirection from paypal to my site.

 

unnamed.png

 

the image above it's the screen where the loader  "forever running". I'm doing something wrong? I can't made it work on mobile also with the "standard desktop" flow

Login to Me Too

Haven't Found your Answer?

It happens. Hit the "Login to Ask the community" button to create a question for the PayPal community.