URL-based session syncing

Development instances communicating with the Frontend API without third-party cookies

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 Dashboard, navigate to your development instance's Settings > General 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 Hosted Pages and redirects

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

Destination page	React component	Helper
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>