Adaptive Payments without modal box or popups?

Question

Is it possible to launch the payflow entirely inline (a la Express Checkout)? How?

We're using chained payments and everything works on non-iOS-mobile devices (and in Chrome for iOS), but we're making a web app, so we need this to work on phones. Testing on the iPhone, we have this problem with PayPal's code that I've already asked about, as well as the fact that when I get around that bug by doing a location.replace with the URL to PayPal (or loading it in a lightbox of my own design), iOS and mobile Safari kill the "Log In" popup (without giving the user an opportunity to view it if they so choose).

In short, is there any way I can use Adaptive Payments without ridiculous 1990s-era popups???

If there's a way to avoid the modal box or popups on iOS devices, I haven't found it. I had to integrate the mini flow for iOS devices, which does work albeit with the popups. — Alex, Jul 30 '14 at 02:19

score 2 · Answer 1 · edited May 23 '17 at 11:52

2

Here's what I'm doing to use PayPal's mobile web flow. I'm testing on Android and it's working well. The only hang up is the callbackFunction is not firing in mobile browsers and works fine in desktop browsers. (I'm still working on this part. Let me know if you solve it.) Here's an example on how to do it using expType=mini to launch the PayPal mini browser experience.

First include the Javascript for the Mini flow:

<script src="http://www.paypalobjects.com/js/external/apdg.js"></script>

Then a link to launch the redirect:

<a id="payPalRedirect" href="https://www.sandbox.paypal.com/webapps/adaptivepayment/flow/pay?paykey={paykey}&expType=mini" target="_blank">Complete PayPal Payment</a>
<br /><br />
<div id="resultDiv"></div>

And some Javascript to initiate the Mini Flow process and the callbackFunction:

        var returnFromPayPal = function () {
           alert("Returned from PayPal");
           var div = document.getElementById('resultDiv');
           div.innerHTML = "Returned from PayPal!";
           // Here you would need to pass on the payKey to your server side handle to call the PaymentDetails API to make sure Payment has been successful or not
           // based on the payment status- redirect to your success or cancel/failed urls
       }
       var dgFlowMini = new PAYPAL.apps.DGFlowMini({ trigger: 'payPalRedirect', expType: 'mini', callbackFunction: 'returnFromPayPal' });

More insights and solution options to this issue can be found here:

Paypal Embedded Flow not using returnUrl or cancelUrl

edited May 23 '17 at 11:52

Community

1
1

answered Jul 18 '13 at 16:29

James

1,440
14
12

2

We actually were able to solve the problem of getting back to our site after the popup/modal, it was just an iOS Safari/webapp glitch that we were getting hung up on. It ended up being so bad, and PayPal's support so unhelpful (we spent hours on the phone), that we ultimately gave up on Adaptive Payments and fundamentally altered our business model. Here's our old solution for closing the PayPal window, I hope it's of some use to you: http://pastebin.com/Dt0kDjGs – Ben Y Jul 18 '13 at 21:24
@James did you end up getting this to work? I am using Adaptive/Chained payment in iOS and Android using webview but using the Standard web pages that aren't mobile friendly. Before spending time on converting to Embedded Payment Flow it would be great to know if it actually works or not? – Heinrich Oct 11 '15 at 16:41
1

I don't recall getting this to work well in mobile browsers. I ended up completing this functionality when I converted the HTML5 prototype to a native app. – James Oct 12 '15 at 14:29
@James I am using native iOS and Android apps for PayPal Adaptive/Chained payments. Did you use Chained Payments in your native app? If so, how did you implement it and was it a mobile friendly UI? The only option I can find is not mobile friendly PayPal html where you have to zoom in to see the payment screens. – Heinrich Oct 13 '15 at 18:12
@Heinrich PayPal has a native app SDK you can integrate with your app. Here's a couple links that might point you in the right direction. https://developer.paypal.com/webapps/developer/docs/classic/use-cases/uc_mobile-app-checkout/ and https://developer.paypal.com/docs/integration/mobile/mobile-sdk-overview/ – James Oct 14 '15 at 14:45
@James We looked at the native SDKs, they don't support Adaptive Chained payments. As for Braintree, it has a solution but doesn't offer the purchase protection for credit card purchases that PayPal does and for our app that was something we wanted. Hopefully the native SDKs or REST APIs will eventually support Adaptive Chained payments. – Heinrich Oct 14 '15 at 17:48

Adaptive Payments without modal box or popups?

1 Answers1

Linked