Skip to Content
Clerk logo

Clerk Docs

Ctrl + K
Go to clerkstage.dev

URL-based session syncing

Development instances created before December 6, 2022 communicate with Clerk's Frontend API using third-party cookies. More concretely, the authentication state of the current session is transported via a long-lived third-party cookie, between your frontend (e.g. localhost:3000) and the Frontend API (e.g. clerk.happy.hippo-1.lcl.dev).

URL-based session syncing (previously known as Cookieless Development mode) is a new, experimental mode of operation for development instances, in which communication with the Clerk Frontend API is done via URL decoration instead.

This mode only applies to development instances. Production instances remain unaffected and continue communicating with Frontend API using first-party, HttpOnly cookies.

Migrating to URL-based Session Syncing

To opt-in to URL-based session syncing, perform the following steps:

  • In the Clerk Dashboard, navigate to your development instance's Settings page and toggle on Enable URL-based session syncing.
  • Upgrade @clerk/clerk-react to v4.4.5 or later. If your are importing @clerk/clerk-js to your project, use v4.18.0 or later.

Clerk Account Portal pages and redirects

In URL-based session syncing mode, navigating from your application to your Clerk Account Portal pages must be done using the Clerk redirection helpers and Control Components as shown in the following table:

Destination pageReact componentHelper
Sign-up<RedirectToSignUp />Clerk.redirectToSignUp()
Sign-in<RedirectToSignIn />Clerk.redirectToSignIn()
User profile<RedirectToUserProfile />Clerk.redirectToUserProfile()
Create organization<RedirectToCreateOrganization />Clerk.redirectToCreateOrganization()
Organization profile<RedirectToOrganizationProfile />Clerk.redirectToOrganizationProfile()

For custom HTML anchors use the Clerk.redirectWithAuth helper:

<a onClick={() => clerk.redirectWithAuth('your_destination_url')}>My link</a>

What did you think of this content?

Clerk © 2023