Add Authie to Next.js.

1. Create an integration

1. Create an application in the Authie console.Add the production origin, such as https://storytail.example.
2. Choose Next.js/server application.Register the exact callback https://storytail.example/api/auth/callback.
3. Copy both generated keys.The secret key is shown once and must remain server-only.

NEXT_PUBLIC_AUTHIE_PUBLISHABLE_KEY=authie_pk_v1_...
AUTHIE_SECRET_KEY=authie_sk_...

2. Install the SDK

npm install https://authie.ai/sdk/authie-nextjs-0.3.2.tgz

This single package contains the server integration and the React UI.

3. Add the auth route

// src/lib/authie.ts
import { createAuthie } from "@authie/nextjs";
export const { auth, currentUser, handlers, proxy } = createAuthie();

// src/app/api/auth/[...authie]/route.ts
import { handlers } from "@/lib/authie";
export const { GET, POST } = handlers;

// proxy.ts
export { proxy } from "@/lib/authie";

4. Add the UI

"use client";
import { AuthieProvider, SignInButton, UserButton } from "@authie/nextjs/react";

<AuthieProvider>
  <SignInButton />
  <UserButton />
</AuthieProvider>

Sign-up automatically checks Authie for an existing email and offers Sign in with Authie instead of attempting a duplicate account.

5. Protect server code

import { auth } from "@/lib/authie";

const { userId, user } = await auth();
if (!userId) return new Response("Unauthorized", { status: 401 });

Use server-side identity for protected operations; client UI guards are only presentation.

Before launch

• Test valid login and callback
• Test token expiry and refresh rotation
• Test logout and local-session invalidation
• Test disabled users and cross-application isolation

Need another framework? Follow the standards-based OIDC requirements.