Encode credit card using JavaScript and PHP

Question

I don't have a SSL for my website, and I need to pass the credit card number from one page to another page. The scenario is like this.

1. I will check the credit card number (is that a valid number)
2. Then i will post the value to another one page response.php

3. The post value should be encrypted from index.php and I should be able to decrypt it in the next page (response.php)

    <script type="text/javascript"> function validate(payment_form){ var error=""; if(trim(payment_form.credit_card_number.value).length==0){ document.getElementById("credit_card_number_error").innerHTML="Enter Credit Card Number"; error+= false; }else{ if(IsNumeric(payment_form.credit_card_number.value)==false){ document.getElementById("credit_card_number_error").innerHTML="Enter numeric values"; error+= false; } else{ document.getElementById("credit_card_number_error").innerHTML=""; error+= ""; } } if(error==""){ return true; } else{ return false; } } function IsNumeric(strString) { var strValidChars = "0123456789.-"; var strChar; var blnResult = true; if (strString.length == 0) return false; for (i = 0; i < strString.length && blnResult == true; i++) { strChar = strString.charAt(i); if (strValidChars.indexOf(strChar) == -1) { blnResult = false; } } return blnResult; } </script> <form id='payment-form' name="payment_form" onSubmit="return validate(this)" action='response.php' method='POST'> <table> <tr><td>Credit Card Number</td><td><input type="text" placeholder="Credit Card Number" value="" id="credit_card_number" name="credit_card_number"></td><td><label class="error" id="credit_card_number_error"/></td> <tr><td></td><td><input type="submit" value="PAYMENT" class="login" id="payment" name="payment"></td></tr> </table> </form> 

To summarize all, I am using a form to post the credit card number and it needs to be encoded and I would be able to decode it in the next page. Is this possible.

Answer 1

It is impossible to do what you want securely without SSL and "real" certificates, ie, signed by trusted certification authorities.

• If you use symmetric encryption , the client must know the secret key, therefore the attacker can easily capture the key by simple eavesdropping. With some more eavesdropping, he can capture the encrypted credit card number and decrypt it right away.
• if you use asymmetric encryption , the attacker might be able to perform a man in the middle attack that you cannot even detect (ie, the attacker replaces the public key with one of his own, you encrypt the data to him, he decrypts it, reads the data, re-encrypts it with the real public key sent by the server; with SSL and "real" certificates, the browser would be able to tell the difference between the real public key and the attacker's one)!

Please, please, please: don't try to be creative on security/cryptography unless you are a guru (in which case you would most probably be developing algorithms, and not making websites). Odds are you will build something badly broken.

The reason why SSL with "real" certificates makes this secure is because those certificates are signed by certification authorities , which will make your browser recognize them as valid. If they are not signed by a certification authority recognized by the browser, it will display a horrible screen telling the user that he is probably being attacked. It is not feasible for an attacker to generate a valid signature for a certificate for your domain.

Go buy a certificate. I've recently transferred my domain to a new registrar and they offered me an SSL certificate for $1.99 for 1 year (it is not wonderful -- the CA is not recognized by my Android Chrome; but well... $1.99...)

Answer 2

Use local storage to save the CC number so that it doesn't need to be sent to the server.

localStorage.ccnum = num;

var num = localStorage.ccnum;

Answer 3

In case you are using SSL it will alweays be good. But consider that you want to make and AJAX call to your own PHP/JSP page then you can do a trick.

Trick:

Option#1: Replace all numeric characters using simple String.replaceAll method with alphabets in your algorithem. For example you replace all '1' by 'a', all '2' with 'b'. Or you can do it other way round. ie '1' replaced by 'z' , '2' replaced by 'y', etc.

Option#2: You can use a random character generator to get unique 10 characters. Each for a separate number. Then in your ajax call you need to pass on that random generated string of characters (which length was 10). Then your PHP or JSP page will use the same algorithm to decrypt the creditcard number.

The method 2 is more secure as it will always be random. This can be made more secure in a way that you make an ajax call first to ask your PHP/JSP page to generate the 10 alphabets (each for a number) and store that somewhere in DB or in session. Then it returns the key or index to that stored 10 alphabets and in your AJAX call you will not be passing the actual encryption algorithem string. So no one will be able to understand what is happening.