How to enforce single page web app security?

For example I am writing a web app using AngularJS, and it stores confidential information for the user like their credit card number.

I am thinking what are some of the security protocols I should be using. I am not experienced in security so I find myself helpless in this kind of issue. I have sorted out some of the requirements:

  • Client side is never secured, thus the server needs to do its own validation on user identity.
  • Server cannot store password as plain text in database, instead a irreversibly modified string.
  • Sending password across internet is insecure, thus server cannot ask for original password.

I am confused up to this point as the requirements seem to contradict themselves. I have to perform irreversible transformation on the user password, and my server cannot ask for the original, it means the transformation can only be done on the client side. On the other hand, you can never trust a client side as it's all open to the user and prone to hacking.

Are there any existing security protocol/framework that addresses the issues that I mentioned?

1) If you are dealing with any sort of confidential information you should be using https. This will allow the passwords to be sent from the client to your server. 2) On password creation hash it, and save that hash in your db. On future sign ins, you can hash the password provided and compare the hash values.

3) If you're dealing with credit card information there is a whole wack-load of other stuff you have to consider. You should take a quick look at PCI requirements (if you're saving credit card information), and if you're just looking to process a credit card I would recommend delegating that to a 3rd party resource like Stripe. They will handle all the card-security aspects for you.

You should also look into cleaning and validating user input to avoid SQL injections, Cross-site scripting and the like.