docs: add Nuxt + Cloudflare Pages + D1 example#8
Open
amondnet wants to merge 2 commits into
Open
Conversation
Add a minimal example demonstrating better-auth with Nuxt on Cloudflare Pages using D1 as the database. Includes email/password authentication, SSR session management, auth middleware, login/signup/dashboard pages, and CLI-based schema generation via `npx auth generate`.
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
There was a problem hiding this comment.
2 issues found across 18 files
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="examples/nuxt-d1-cloudflare/nuxt.config.ts">
<violation number="1" location="examples/nuxt-d1-cloudflare/nuxt.config.ts:9">
P1: Do not fall back to a hardcoded auth secret; require `BETTER_AUTH_SECRET` so production cannot start with a predictable signing key.</violation>
</file>
<file name="examples/nuxt-d1-cloudflare/pages/signup.vue">
<violation number="1" location="examples/nuxt-d1-cloudflare/pages/signup.vue:14">
P2: Handle thrown signup errors with `try/catch/finally` so loading state is always cleared and failures are shown to the user.</violation>
</file>
Architecture diagram
sequenceDiagram
participant Browser as Client (Nuxt/Vue)
participant Middleware as Auth Middleware
participant Server as Nitro Server (Cloudflare Worker)
participant Auth as better-auth (Server)
participant D1 as Cloudflare D1 (Database)
Note over Browser,D1: SSR Session Validation / Route Protection
Browser->>Middleware: NEW: Request /dashboard
Middleware->>Browser: NEW: authClient.useSession(useFetch)
Browser->>Server: GET /api/auth/get-session
Server->>Auth: NEW: getAuth(event)
Note right of Auth: Reads env.DB & BETTER_AUTH_SECRET
Auth->>D1: Query session/user data
D1-->>Auth: Record found
Auth-->>Server: Session object
Server-->>Browser: 200 OK (Session JSON)
alt Session exists
Middleware-->>Browser: Allow navigation to Dashboard
else Session missing
Middleware-->>Browser: NEW: navigateTo('/login')
end
Note over Browser,D1: User Signup Flow
Browser->>Server: NEW: POST /api/auth/signup
Server->>Auth: auth.handler()
Auth->>D1: NEW: Create User & Session records
D1-->>Auth: Success
Auth-->>Server: Set-Cookie (session_token)
Server-->>Browser: 200 OK
Note over Browser,D1: Protected API Route Flow
Browser->>Server: GET /api/me
Server->>Auth: NEW: auth.api.getSession(headers)
Auth->>D1: Validate session token from headers
D1-->>Auth: Valid user record
Auth-->>Server: Session/User data
alt Authorized
Server-->>Browser: { user: ... }
else 401 Unauthorized
Server-->>Browser: Throw 401 Error
end
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.
| error.value = '' | ||
| loading.value = true | ||
|
|
||
| const { error: signUpError } = await authClient.signUp.email({ |
There was a problem hiding this comment.
P2: Handle thrown signup errors with try/catch/finally so loading state is always cleared and failures are shown to the user.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At examples/nuxt-d1-cloudflare/pages/signup.vue, line 14:
<comment>Handle thrown signup errors with `try/catch/finally` so loading state is always cleared and failures are shown to the user.</comment>
<file context>
@@ -0,0 +1,60 @@
+ error.value = ''
+ loading.value = true
+
+ const { error: signUpError } = await authClient.signUp.email({
+ name: name.value,
+ email: email.value,
</file context>
- Remove hardcoded fallback secret, add runtime guard for missing BETTER_AUTH_SECRET - Fix middleware to only run on client side (import.meta.client guard) - Protect all /dashboard sub-routes with startsWith - Update README code snippet to show per-request getAuth(event) pattern
There was a problem hiding this comment.
1 issue found across 4 files (changes from recent commits).
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="examples/nuxt-d1-cloudflare/middleware/auth.global.ts">
<violation number="1" location="examples/nuxt-d1-cloudflare/middleware/auth.global.ts:4">
P1: The new client-only early return disables auth checks during SSR, so protected `/dashboard` routes are no longer enforced server-side.</violation>
</file>
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.
| import { authClient } from '~/lib/auth-client' | ||
|
|
||
| export default defineNuxtRouteMiddleware(async (to) => { | ||
| if (!import.meta.client) { |
There was a problem hiding this comment.
P1: The new client-only early return disables auth checks during SSR, so protected /dashboard routes are no longer enforced server-side.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At examples/nuxt-d1-cloudflare/middleware/auth.global.ts, line 4:
<comment>The new client-only early return disables auth checks during SSR, so protected `/dashboard` routes are no longer enforced server-side.</comment>
<file context>
@@ -1,9 +1,13 @@
import { authClient } from '~/lib/auth-client'
export default defineNuxtRouteMiddleware(async (to) => {
+ if (!import.meta.client) {
+ return
+ }
</file context>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
npx auth generateChanges
examples/nuxt-d1-cloudflare/- complete Nuxt example appwrangler.toml- Cloudflare Pages + D1 binding configurationnuxt.config.ts- Nuxt config with Cloudflare preset and nitro D1 bindingsserver/lib/auth.ts- better-auth server setup with D1 adapterlib/auth-client.ts- better-auth client setupmiddleware/auth.global.ts- global auth middleware for route protectionpages/- login, signup, dashboard, and index pagesserver/api/- auth catch-all handler and/api/meendpointREADME.md- setup and deployment instructionsTest Plan
Summary by cubic
Adds a minimal
Nuxt+Cloudflare Pagesexample usingD1withbetter-authfor email/password auth and SSR sessions. Also adds a per-request auth setup for Pages and tightens middleware/secret handling.New Features
examples/nuxt-d1-cloudflare/withbetter-auth+D1onNuxtand Pages./api/meusingauth.api.getSession(); ready-to-runwrangler.toml,nuxt.config.ts,.env.example, and schema/migration scripts.Bug Fixes
BETTER_AUTH_SECRETat runtime; removed any fallback secret.import.meta.clientand protect all/dashboard*routes.getAuth(event)for Cloudflare Pages.Written for commit 0306761. Summary will update on new commits.