How to implement 3d secure payment securely

Question

I'm wondering what's the best way of accepting payments from credit cards that require 3-D Secure verification. Currently the checkout flow is like this:

1. Customer submits payment
2. Payment gateway returns an error stating that the card requires 3-D secure code processing. Returns the ACS URL in the response
3. I redirect user to the issuing bank's verification site and I pass a callback URL for the ACS to redirect after completion of verification
4. Customer enters verification code and ACS redirects to the callback URL with an authorization token indicating successful verification
5. To complete the process, I have to resubmit the original request with the authorization token to the payment gateway

My problem is in the final step. As I need to resubmit the original request (which contains the credit card information of the customer), I need to store it somewhere temporarily so I can retrieve it when the callback URL is called. Is there an alternative to this?

I'm thinking of trying an iframe solution: The original form is never closed and I display the verification process in an iframe. When the process completes, i.e. the callback url is called, I hide the iframe and update the original form with the needed values and resubmit. Has anyone tried this technique before?

---

Answer 1

I've done some recent work with 3d secure. From my personal experience:

1. I pass the credit card information with a forward url to the banks 3d secure url.
2. The user is redirected to the 3d secure url and prompted to type in his password.
3. When he clicks continue, the user is passed to the forward url with the authorization token -- the credit card information gets passed along as well.

Answer 2

With Sage Pay (and I would assume other payment providers) you don't need to pass the full order information again in the last step, just the response code from the 3D Secure form and a unique transaction reference. Storing the card details is therefore not necessary.

For me the process is:

1. Card details etc. and unique transaction reference submitted to payment gateway.
2. Payment gateway responds with 3D secure details (ACSURL and reference codes).
3. Redirect user to 3D Secure form (passing ref codes and callback URL) where they enter their details.
4. Verification code passed back to callback URL.
5. Server must send the verification code and same transaction reference from step 1 to the payment gateway.
6. Payment gateway responds with success/failure information.

Answer 3

As you might already noticed in article you linked, presenting bank's page in iframe is a preferred option. Although if you read in further, it presents other security features, specifically in regard to phishing protection. Because your client won't know to whom is he really sending his password.

But going back to your proposition, if you present it in iframe or popup window, you would be able to store the original form on your base page and then resubmit it with received authentication token. It's a very good idea because you would not need to do any PCI compliance stuff. So not only it's easier for you it is recommended :).