Allowing users to logout from your site

Last modified: March 13th, 2023

Working with a specific static site generator?
Customize CloudCannon's documentation to suit your SSG.

Great! We'll show you documentation relevant to .
You can change this any time using the dropdown in the navigation bar.

Once a user is authenticated, they can log out at <your-domain>/logout. You can provide a logout button on your authenticated pages with this link.

index.html
copied
<a href="/logout">Log out</a>

Detecting if a user is logged in#

CloudCannon sets a cookie when the user is authenticated. Use this to show the logout button for authenticated users on public pages, and hide it otherwise.

No sensitive authentication data is exposed through cookies.

The cookie is used to set a class on the body. The CSS will show the logout button with this class.

script.js
copied
var isAuthenticated = document.cookie.indexOf("authenticated=true") >= 0;

if (isAuthenticated) {
  document.body.className += " authenticated";
}
styles.css
copied
.logout {
  display: none;
}

.authenticated .logout {
  display: block;
}
index.html
copied
<a href="/logout" class="logout">Log out</a>
Open in a new tab