Guides
LoginTry for Free

Enhance Auth Routes with Sessions

Store tokens and session data using your configured session middleware.

Suggest Edits

Your Express server maintains each user's tokens in secure sessions, keeping sensitive authentication data out of the frontend.

Now that your session middleware is installed, add session management logic into your auth routes.


Enhance Existing Auth Routes

The following shows how to enhance your Callback and Logout endpoints to manage sessions.


Callback Route

The Wristband SDK will return token data (access token, refresh token, etc.) as well as user information based on your scopes SDK configuration value.

Save that data into your session before navigating to your app's home page:

// Callback endpoint
app.get('/auth/callback', async (req, res, next) => {
  try {
    const callbackResult = await wristbandAuth.callback(req, res);
    const { callbackData, result } = callbackResult;

    if (result === CallbackResultType.REDIRECT_REQUIRED) {
      return;
    }
    
    /* ***** BEGIN NEW SESSION LOGIC ***** */

    // You can choose which user info to store in the session based on your app requirements.
    // The following fields are a good minimum to include.
    req.session.isAuthenticated = true;
    req.session.accessToken = callbackData.accessToken;
    // Convert expiration seconds to a Unix timestamp in milliseconds.
    req.session.expiresAt = Date.now() + callbackData.expiresIn * 1000;
    req.session.refreshToken = callbackData.refreshToken;
    req.session.userId = callbackData.userinfo.sub;
    req.session.tenantId = callbackData.userinfo.tnt_id;
    req.session.identityProviderName = callbackData.userinfo.idp_name;
    req.session.tenantDomainName = callbackData.tenantDomainName;
    req.session.tenantCustomDomain = callbackData.tenantCustomDomain || undefined;

    // This persists any updated session values.
    await req.session.save();
    
    /* ***** END NEW SESSION LOGIC ***** */

    return res.redirect(callbackData.returnUrl || 'http://localhost:3000/your-react-home-route');
  } catch (err) {
    console.error(err);
    next(err);
  }
});

Logout Route

The Logout endpoint needs to destroy your application's session, revoke the refresh token (if applicable), and redirect the user to the Wristband Logout Endpoint.

// Logout endpoint
app.get('/auth/logout', async (req, res, next) => {
  /* ***** BEGIN NEW SESSION LOGIC ***** */
  
  const { refreshToken, tenantCustomDomain, tenantDomainName } = req.session;
  const logoutConfig = { refreshToken, tenantCustomDomain, tenantDomainName };
  res.clearCookie(SESSION_COOKIE_NAME);
  session.destroy();
  
  /* ***** END NEW SESSION LOGIC ***** */

  try {
    // Make sure to include refresh token and tenant domain in logout config for
    // successful revocation and redirection.
    return await wristbandAuth.logout(req, res, logoutConfig);
  } catch (err) {
    console.error(err);
    return next(err);
  }
};


Introduce a Session Route

You'll need to add a Session endpoint so that your frontend has a way to check initial authentication state and load necessary session data into the browser.

📘

Quick Start Note

This route will be protected by authentication middleware later in this guide. For now, we use basic validation logic to help you test your auth integration.

// app.ts

...

// Session endpoint
app.get('/session', (req, res) => {
  const { email, isAuthenticated } = req.session;

  if (!isAuthenticated) {
    return res.status(401).send();
  }
  
  //
  // You can additionally make other API calls to gather any other data you might want to
  // return to your frontend.
  //

  // Add whatever data you want to return to the frontend in this response.
  return res.status(200).json({ isAuthenticated: true, email });  
});

...

Next, let's configure the frontend React single-page app to handle authenticated sessions, building on your Express server's session management.

Updated 1 day ago

What’s Next