Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

PayPal integration with iframe-based cart

We use PayPal's Payments Pro NVP API to provide seamless credit card and paypal processing on our site. We've created an iframe-based cart widget that our customers put onto their site so their users can purchase items and pay via our Paypal account.

While credit card transactions work fine, we're seeing issues when a user tries to pay with their the PayPal account. The API uses a redirect when clicking the PayPal logo but then PayPal's code seems to run a framebusting script and the transaction can't continue.

I am seeking suggestions or sample code for how to handle users wishing to PayPal for their payment via the iframe. One option is to pop-up a new window but then it leaves the design open to issues since the user can switch between that window and the window containing the iframe and conceivably get the cart out of sync with what the PayPal window is displaying.

like image 353
SteveL Avatar asked Sep 03 '11 02:09

SteveL


2 Answers

Both of the above answers are correct. However, PayPal tech support provided a more thorough set of instructions which I've provided below. Hopefully they'll help someone else.

Modify your SetExpressCheckout calls so that the RETURNURL and CANCELURL parameters point to a special return page that will handle closing the pop-up window for you and continuing the normal checkout process (more on this later).

Next, modify the script that redirects the buyer over to the PayPal website. Normally, this script would return a “302 Found” (or similar) response to the browser, telling the browser that it should follow a redirect to some other page. (In PHP, this is usually accomplished with the “header” function – e.g., header(“Location: https://www.paypal.com/cgi-bin/webscr?cmd=_express-checkout&token=$token”); .) Instead, this script should emit the following HTML/JavaScript code (replacing “TOKEN” with the token you received from PayPal). This will open a pop-up window where the buyer can continue the checkout process on PayPal. You can insert additional text, as you like, to indicate to the buyer that they should be using the pop-up window to complete their checkout. To avoid issues with pop-up blockers, you can create a link or button on your page, indicating to the buyer that they should click the link/button to continue, and use this code for the object’s “onClick” handler.

<script type="text/javascript"> window.open("https://www.paypal.com/cgi-bin/webscr?cmd=_express-checkout&token=TOKEN","_blank","width=1024,height=768,location=1,resizable=1,scrollbars=1,status=1",true); </script>

Now, create a new page that executes the following code (or similar – this code is based on PHP, adjust as necessary for whatever language you are using). This code will close the pop-up window and continue the checkout process in your existing iframe. The RETURNURL parameter of your SetExpressCheckout call should point to this page. Replace “paypalreturn.php” with the script you currently use to handle buyers returning to your shopping cart from PayPal.

<html>
<body>
<script type="text/javascript">
window.opener.location="http://www.regattacentral.com/paypalreturn.php?token=<? echo $_REQUEST["token"]; ?>&PayerID=<? echo $_REQUEST["PayerID"]; ?>";
window.close();
</script>
</body>
</html>

Lastly, repeat this step for your CANCELURL handler.

• The purchase completes inside of the iframe, and the transaction ID for the purchase is shown.

like image 165
SteveL Avatar answered Oct 23 '22 04:10

SteveL


PayPal Express Checkout / 'Pay with PayPal' in Pro Hosted does not support iframes for security reasons. Opening a pop up window (or setting target=_parent) is the only way to process this properly.

like image 28
Robert Avatar answered Oct 23 '22 04:10

Robert