<RedirectToSignIn />
The <RedirectToSignIn />
component will navigate to the sign in URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack.
Usage
import {
ClerkProvider,
SignedIn,
SignedOut,
RedirectToSignIn,
} from "@clerk/nextjs";
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html>
<body>
<ClerkProvider>
<SignedIn>
{children}
</SignedIn>
<SignedOut>
<RedirectToSignIn />
</SignedOut>
</ClerkProvider>
</body>
</html>
);
}
import {
ClerkProvider,
SignedIn,
SignedOut,
RedirectToSignIn,
} from "@clerk/nextjs";
import { AppProps } from "next/app";
function MyApp({ Component, pageProps } : AppProps) {
return (
<ClerkProvider>
<SignedIn>
<Component {...pageProps} />
</SignedIn>
<SignedOut>
<RedirectToSignIn />
</SignedOut>
</ClerkProvider>
);
}
export default MyApp;
import {
ClerkProvider,
SignedIn,
SignedOut,
RedirectToSignIn
} from "@clerk/clerk-react";
function PrivatePage() {
return (
<ClerkProvider publishableKey={`YOUR_PUBLISHABLE_KEY`}>
<SignedIn>
Content that is displayed to signed in
users.
</SignedIn>
<SignedOut>
<RedirectToSignIn />
</SignedOut>
</div>
);
}
import {
SignedIn,
SignedOut,
RedirectToSignIn,
UserButton,
} from "@clerk/remix";
export default function Index() {
return (
<div>
<SignedIn>
<h1>Index route</h1>
<p>You are signed in!</p>
<UserButton />
</SignedIn>
<SignedOut>
<RedirectToSignIn />
</SignedOut>
</div>
);
}
- Name
signInFallbackRedirectUrl?
- Type
string
- Description
The fallback URL to redirect to after the user signs in, if there's no
redirect_url
in the path already. Defaults to/
. It's recommended to use the environment variable instead.
- Name
signInForceRedirectUrl?
- Type
string
- Description
If provided, this URL will always be redirected to after the user signs in. It's recommended to use the environment variable instead.
- Name
initialValues
- Type
SignInInitialValues
- Description
The values used to prefill the sign-in fields with.