Is it safe to design a web page where logout functionality is done through clicking a link instead of a form button?

Question

I have come across many articles which warn against using links to provide logout functionality. They all recommend using a form and button for logout.

When I used firebug to examine the html for gmail's logout element,I found that it is a link:

<a target="_top" role="button" id="gb_71" onclick="gbar.logger.il(9,{l:'o'})" href="?logout&amp;hl=en" class="gbqfbb">Sign out</a>

The href has something like

https://mail.google.com/mail/ca/?logout&hl=en

Are they using a link because the href is https? How safe is this usage?

Answer 1

The reason that developers are discouraged from using links, rather than forms, is because it leaves a site open to CSRF (Cross Site Request Forgery) attacks. Imagine you have a site, and the logout URL is example.org/?logout. If you visit my site, and I load that URL, it will log you out of your current session on example.org. This does not seem destructive, but it is rather annoying to have to keep logging in.

Now imagine it where you have implemented it as a form...

<form action="?logout" method="POST">
  <input type="hidden" value="blahblah" name="key" alt="I am a random key!" />
  <input type="submit" value="Log out..." />
</form>

The value of key would be randomly generated on the loading of the page. When the url example.org?logout is loaded, it checks the session to make sure that the random key is the same as that submitted by the form. If it is not the same, the user may not log out. If it is the same, they may.

This simple method stops the described CSRF attack. It is simple and effective, and there is really no reason NOT to implement it.