The <SignIn/> component cannot render when a user is already signed in, unless the application allows multiple sessions. Since a user is signed in and this application only allows a single session, Clerk is redirecting to the afterSignIn URL instead. (This notice only appears in development)

[Victorosayame]

i keep getting this error even when i did everything correctly, i also cloned yours,created a new clerk and liveblocks account and still gets the same error.

The component cannot render when a user is already signed in, unless the application allows multiple sessions. Since a user is signed in and this application only allows a single session, Clerk is redirecting to the afterSignIn URL instead.
(This notice only appears in development)

[FrBosquet]

I have the same issue. Please help, is so annoying

[AbhinavSharma486]

I have the same issue. Please help, is so annoying

i also have same issue

[jordanskizash]

Same issue, only in development.

[FrBosquet]

I solved it for my case:

• Turned my sign in component to a client side one, using 'use client'
• Check if there is an user with useUser, redirect to my private dashboard if positive
• Show the log in component other-wise

For some reason the sign in page is being sent to the client without an user before hydration, after hydration there is an user and thats where the issue happens.

[shabazs453]

@FrBosquet , can you sent your sign in component's code? please.

[shabazs453]

@FrBosquet
I changed my middleware file to following

**import { clerkMiddleware, createRouteMatcher } from "@clerk/nextjs/server";
const isPublicRoute = createRouteMatcher(["/sign-in(.)", "/sign-up(.)"]);

export default clerkMiddleware((auth, request) => {
if (!isPublicRoute(request)) {
auth().protect();
}
});

export const config = {
matcher: [
// Skip Next.js internals and all static files, unless found in search params
"/((?!_next|[^?]\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).)",
// Always run for API routes
"/(api|trpc)(.*)",
],
};**

It checks user authentication on server side itself.

So I removed the redirect to sign-in page from home page and changed it to return null.

import Link from "next/link";
import { redirect } from "next/navigation";

const Home = async () => {
const clerkUser = await currentUser();
if (!clerkUser) return null;

const roomDocuments = await getDocuments(
clerkUser?.emailAddresses[0]?.emailAddress
);

Also you have to correctly synchronize the system time to actual time since tokens do not work properly when being passed to clerk server.

[Pratik1805]

Adjust your system time correctly according to your time zone in your settings, worked for me