Skip to Content
Clerk logo

Clerk Docs

Ctrl + K
Go to



import * as React from 'react'; import { withServerAuth } from 'gatsby-plugin-clerk/ssr'; import { PageProps } from "gatsby"; export const getServerData = withServerAuth( async props => { return { props: { data: '1', auth: props.auth } }; }, { loadUser: true }, ); function SSRPage({ serverData }: PageProps) { return ( <main> <h1>SSR Page with Clerk</h1> <pre>{JSON.stringify(serverData, null, 2)}</pre> </main> ); } export default SSRPage;


withServerAuth takes two arguments:

function withServer(cb: Callback, options: Options): GetServerDataReturn;

Gatsby then automatically passes the result of withServer's callback to the serverData property on the page's component props.

Callback props

authServerSideAuthThe authentication data for the active user and their current session.
sessionSessionThe current session.
userUserThe current user.
organizationOrganizationThe current organization.


sessionIdstring | nullThe ID of the current session.
userIdstring | nullThe ID of the current user.
actorActJWTClaim | nullThe JWT actor for the session.
getToken() => Promise<string | null>A function that returns a promise that resolves to the current user's session token; can also be used to retrieve a custom JWT template
claimsClerkJWTClaims | nullThe JWT claims for the session.


loadUser?booleanIf true, load the user data for the current auth session.
loadSession?booleanIf true, load the session data for the current auth session.
loadOrg?booleanIf true, load the organization data for the current auth session.
jwtKey?stringAn optional custom JWT key to use for session token validation.
authorizedParties?string[]An allowlist of origins to verify against, to protect your application from the subdomain cookie leaking attack.
For example:
['http://localhost:3000', '']
For more information, refer to the reference guide.

Last updated on October 10, 2023

What did you think of this content?

Clerk © 2024