Being able to edit data immediately is an awesome feature provided by two of my favorite web tools – Trello and JIRA. It is super easy to change information that might have been entered wrong, or simply needs updating. I often use this sort of element in my own applications so I decided to make a more reusable component with a JQuery plugin. I also love Twitter Bootstrap’s styling, so the plugin utilizes some of the styling.
What is CSRF?
Say you are logged in to your bank account website. Because you are authenticated, you might be able to do something like transfer funds to another account through the website. This is totally fine, because the cookie on your computer verifies that you are authenticated to the website, and the website checks to make sure that your computer is the one holding the session for your current log in. Now say someone knows what kind of post data needs to be sent to perform that same task (which can easily be gleamed by looking at the HTML of the bank’s website). If they could get your computer to somehow submit the right post data to the right place, they could make bank transfers from your computer, using your session. This is how a CSRF attack works.
Often, CSRF attacks will be masked in an image tag because browsers will attempt to load the resource in the src tag. So if I were to send for instance:
<img alt="" src="http://mymaliciouswebsite.org/dobanktransfer.php" />
in an email, or place it quietly on the bottom of a webpage, comment on a website, or whatever, your browser would attempt to load the resource. This means that a CSRF attack is able to execute actions in the unsuspecting user’s browser as though it was performed by them. Additionally, as far as the bank knows, it was a normal action taken on the user’s behalf.
Getting started – Password security
A common issue that I find with many tutorials and other programmers’ code is that passwords are stored in the database in an insecure way. If someone gains access to the database, you can prevent much of the potential damage by storing the passwords in a way that won’t be of much use to a hacker. Normal hashing functions don’t really accomplish this. Hackers can use a Rainbow Table to try to identify what the password was before the password was hashed. The best way to store a password is to salt the password. This is a technique that adds a unique random string to the beginning or end of each password. This technique requires that a hacker compute an entire hash table to crack a single password, already a much more difficult task than using a cleartext or MD5 hashed password. Lastly, if we use a costly algorithm to hash the passwords initially, it becomes computationally unreasonable for someone to compute a rainbow table for a salted password. PHP has some great tools for performing these functions, so we might as well use them.