Dynamic Billing Information Validations In Checkout System

Question

I'm unsure if this is more of a UX or security oriented question, but here goes nothing. I'm currently trying to simplify my e-store's checkout process by adding dynamic client side validations using JavaScript.

As memory serves, most checkout systems that do full-page refreshes anytime data is submitted will typically wipe out any credit card information the user has entered, I always assumed this was a security precaution.

In my case, credit card information never actually touches my servers. I send the credit card information over to my payment processing system over a secure connection who in turn send me a secure token which I can handle locally and perform validations off of.

With that said, I have the ability to dynamically display specific error messages to the user if the server returns an error response, e.g:

While this is certainly more convenient for the user, does anybody see anything wrong with this workflow from either a UX or security perspective?

Imagine this scenario:

Anita fills out her form & presses the "Pay Now" button expecting everything to succeed. Perhaps she's on a particularly poor wi-fi connection and goes off to do something else while she waits for the server to finish processing her submission. 30 seconds later the server finally responds with an error code pertaining to the entered CVC code, but before Anita gets back to deal with it some malicious person strolls along and has direct access to 2/3 of her credit card information.

What would the best practice here be from both a UX and security perspective?

Answer 1

We're dealing with this on a regular basis. We solved it by making the page blazing fast, inputting logic on the front side (for incorrectly or missed input fields), and then kicking back errors fast.

Having dynamically updating pages is great. In fact, we're not using Javascript at all on our web forms (and we should be...we'll get there!) which is a technical limitation. That said, the behavior we have is simple: input personal info and payment info simultaneously, and retain all personal info but clear payment info on error.

We mitigate the errors in a couple of ways. If the CC number is too short, the page says so (no reload necessary). That type of logic exists for every required form. But if the card information is wrong, we force a reload because on each entry it should be reloaded (and re-entered). This is for security...I can't state that it's also for compliance, but I believe it is.

Currently we have a major fraud problem where fraudsters are attempting to use our pay forms to determine which credit cards are real or fake. Allowing the page to dynamically accept any number of CVVs, for example, is a great way to pick up a lot of bots testing cards. I don't know if you have the capacity to handle that, but it's now been 5 months for us (product and engineering staff of 6) and we still haven't fixed it perfectly. If we had a form like yours, we'd have had to kill it.

Further, know that the failed card entry case is minor, maybe 5% of all entries. It's significant enough to think about, but not significant enough to warrant burdening the other 95% by leaving the gates wide open for attack.

Also, I'd assume that the CC# if changed will retain the other data (exp date and CVV...CVC out of the US). That leads to a worse problem of people testing various card numbers against the other data!

I can't attest to being a security expert, but best bet IMO is to leave the fancy Javascript solution to make entry easier alone because it can cause you way more trouble than it's worth.

Answer 2

This is a good approach however I would limit the number of attempts and then not let them guess again. Lets say you stole someones credit card information digitally. All your missing is the cvc number. One could easily use the number then brute force the CVC if they get infinite attempts. Even with the 30 seconds I could write a distributed script that runs on multiple vms until I get it right.

I would limit the cvc attempts and then after that block that number or make them call up. If a card is used for fraud that will hurt your bottom line. Also users shouldn't mess up their 3 digit cvc more than 5 times.

I see no qualms though about dynamically telling them hey that expiration date doesnt make sense.

I also like dynamically showing them which card they are using. That can prevents whoops I am using my corporate amex cord vs my discovery card for this.

In short dynamic feedback to mitigate errors is always a plus just dont drastically compromise the users security in doing so