A short guide to clickjacking attacks

I recently read an article from JavaScript Weekly (part of the Cooper Press series I subscribe to), and it included a good rundown on clickjacking attacks:

https://auth0.com/blog/preventing-clickjacking-attacks/

It's a good article and worth reading.  Here's a summary.

What clickjacking attacks are

Malicious sites put hidden iframes over a decoy site.  When a user tries to click on something on the decoy site, he or she actually clicks on something in the hidden iframe.  The assumption is that the action taken by the hidden iframe is malicious.

How to prevent them

Front end

There are some workarounds, but these are mostly ineffective.

Back end

Note: if you're using Node.js and Express, the helmet library does 1 and 2 by default.

If both X-Frame-Options and Content-Security-Policy are set, the CSP setting prevails.
  1. Set the X-Frame-Options header to SAMEORIGIN (helmet's default) or DENY.  This is a widely-recognized standard, but it isn't an official standard. 
  2. Set the Content-Security-Policy frame-ancestors option to self or none.  This is an actual standard.
  3. If you use session cookies, set the sameSite attribute on the cookie to Strict.  The article says that this is a more recent standard and doesn't have universal support, but caniuse says that (as of 11/9/2020) there's 86% adoption.  Even recent versions of IE support it.  So unless you're writing an application for a very niche market you should be fine.

Comments

Post a Comment

Popular posts from this blog

Optional object property access

Image
  Photo by Hannah Joshua on Unsplash Options: they aren't just for day traders any more! I just read a post by Dr. Axel Rauschmayer about null and undefined ( link to article ).  Here's a summary of some of the more interesting items about optional object property access and the nullish coalesce operator. The ?. operator is equivalent to "if the property exists, return it else return undefined". You can chain the ?. operator for nested objects: it will return undefined the first chance it gets. The ?? operator is like the `or` operator (||) except that it only passes through null and undefined. Examples: The ?. operator is equivalent to "if the property exists, return it else return undefined". let obj = { foo: 42 }; obj?.address // undefined obj?.foo //42 You can chain the ?. operator for nested objects: it will return undefined the first chance it gets. let users = [     { name: 'Tom', address: { line1: '1234 Main St.', line2: { city: '
Read more

A short guide to cross-site request forgery attacks

Image
Photo from Negativespace . This is a follow-on post to my post on clickjacking attacks . I found this article from Auth0 ( https://auth0.com/blog/cross-site-request-forgery-csrf/ ) while reading the one on clickjacking.  As before, it's worth reading.  Here's a summary. What CSRF attacks are CSRF, aka "c-surf", is an acronym fro Cross-Site Request Forgery.  The attack is where a malicious site uses another site's active session cookie to do something in the place of the user.  E.g. if you're logged in to your bank and go to a site in another browser tab, the other site could use the bank site's active session cookie to transfer money. How to prevent them User Log out of websites, especially sensitive ones. Back end The article and OWASP do a good job of explaining the details, so I'll link to them here and give an overview. https://auth0.com/blog/cross-site-request-forgery-csrf/ https://cheatsheetseries.owasp.org/cheatsheets/Cross-Site_Request_Forgery_
Read more

How is an application like a bride's outfit? - 1 minute read

You've heard the tradition of a bride wearing "something old, something new, something borrowed, something blue."  Well, that's somewhat like a good piece of code.  Here's why: Something old: code you've already written (don't repeat yourself) if you can. Something new: customize the old framework. Something borrowed: similar to the 'something old', if you can find code that someone else has already written and has shared, use it!!  Libraries were written to be used! Something blue: OK, I admit this one is more of a stretch than the others, but bear with me: in this case, 'something blue' is to make something really useful for the user . . . and that starts with character!  Your users will use your application if it's easy to use and solves a problem, but they won't love it unless it's entertaining.  Caveat: Clippy  is proof that this last point needs to be taken with a grain of salt: sometimes, applications are better of
Read more