Get the FREE Ultimate OpenClaw Setup Guide →

convex-auth

Scanned
npx machina-cli add skill PolarCoding85/convex-agent-skillz/convex-auth-skill --openclaw
Files (1)
SKILL.md
5.6 KB

Convex Authentication - Core Patterns

This skill covers universal auth patterns that work with ANY authentication provider.

Auth in Functions

Access the authenticated user via ctx.auth.getUserIdentity():

import { query, mutation, action } from './_generated/server';

export const myQuery = query({
  args: {},
  handler: async (ctx) => {
    const identity = await ctx.auth.getUserIdentity();
    if (identity === null) {
      throw new Error('Not authenticated');
    }
    // identity.tokenIdentifier - unique across providers
    // identity.subject - user ID from provider
    // identity.email, identity.name, etc. (if configured)
  }
});

UserIdentity Fields

FieldGuaranteedDescription
tokenIdentifierUnique ID (subject + issuer combined)
subjectUser ID from auth provider
issuerAuth provider domain
emailProvider-dependentUser's email
nameProvider-dependentDisplay name
pictureUrlProvider-dependentAvatar URL

Critical: Race Condition Prevention

Problem: Queries can execute before auth is validated on page load.

Client-side: Always use useConvexAuth() from convex/react, NOT your provider's hook:

// ✅ Correct - waits for Convex to validate token
import { useConvexAuth } from 'convex/react';
const { isLoading, isAuthenticated } = useConvexAuth();

// ❌ Wrong - only checks provider, not Convex validation
const { isSignedIn } = useAuth(); // from @clerk/clerk-react

Skip queries until authenticated:

const user = useQuery(api.users.current, isAuthenticated ? {} : 'skip');

Use Convex auth components:

import { Authenticated, Unauthenticated, AuthLoading } from "convex/react";

<Authenticated>
  <Content /> {/* Queries here are safe */}
</Authenticated>
<Unauthenticated>
  <SignInButton />
</Unauthenticated>

Storing Users in Database

See USERS.md for complete patterns including:

  • Schema design with indexes
  • Storing users via client mutation
  • Storing users via webhooks (recommended for production)
  • Helper functions for user lookup

Custom Auth Wrappers

Create authenticated function wrappers using convex-helpers:

// convex/lib/auth.ts
import {
  query,
  mutation,
  action,
  QueryCtx,
  MutationCtx,
  ActionCtx
} from './_generated/server';
import {
  customQuery,
  customMutation,
  customAction,
  customCtx
} from 'convex-helpers/server/customFunctions';
import { ConvexError } from 'convex/values';

async function requireAuth(ctx: QueryCtx | MutationCtx | ActionCtx) {
  const identity = await ctx.auth.getUserIdentity();
  if (!identity) {
    throw new ConvexError('Not authenticated');
  }
  return identity;
}

export const authQuery = customQuery(
  query,
  customCtx(async (ctx) => {
    const identity = await requireAuth(ctx);
    return { identity };
  })
);

export const authMutation = customMutation(
  mutation,
  customCtx(async (ctx) => {
    const identity = await requireAuth(ctx);
    return { identity };
  })
);

export const authAction = customAction(
  action,
  customCtx(async (ctx) => {
    const identity = await requireAuth(ctx);
    return { identity };
  })
);

Usage:

import { authQuery } from './lib/auth';

export const myProtectedQuery = authQuery({
  args: {},
  handler: async (ctx) => {
    // ctx.identity is guaranteed to exist
    const userId = ctx.identity.subject;
  }
});

HTTP Actions with Auth

Pass JWT in Authorization header:

// Client
fetch('https://your-deployment.convex.site/api/endpoint', {
  headers: { Authorization: `Bearer ${jwtToken}` }
});

// convex/http.ts
import { httpAction } from './_generated/server';

export const myEndpoint = httpAction(async (ctx, request) => {
  const identity = await ctx.auth.getUserIdentity();
  if (!identity) {
    return new Response('Unauthorized', { status: 401 });
  }
  // ...
});

Debugging Checklist

See DEBUG.md for detailed troubleshooting steps.

Quick checks:

  1. ctx.auth.getUserIdentity() returns null?
    • Check if query runs before auth completes (use "skip" pattern)
    • Check auth.config.ts is deployed (npx convex dev)
  2. Check Settings > Authentication in Convex Dashboard
  3. Verify JWT token at https://jwt.io - check iss and aud fields
  4. Ensure domain in auth.config.ts matches JWT iss
  5. Ensure applicationID matches JWT aud

DO ✅

  • Always check ctx.auth.getUserIdentity() in public functions
  • Use useConvexAuth() hook, not provider's auth hook
  • Skip queries with "skip" until authenticated
  • Use <Authenticated> component to gate protected content
  • Store users in DB for cross-user queries
  • Use tokenIdentifier or subject as unique user key

DON'T ❌

  • Trust client-side auth alone (Convex is a public API)
  • Run queries before checking isAuthenticated
  • Use .filter() to find users by token (use index)
  • Assume identity fields exist (check provider config)
  • Forget to redeploy after changing auth.config.ts

Source

git clone https://github.com/PolarCoding85/convex-agent-skillz/blob/main/.claude/skills/convex-auth-skill/SKILL.mdView on GitHub

Overview

Convex-auth provides universal authentication patterns that work with any provider (Clerk, WorkOS, Auth0, etc.). It covers how to enforce checks in server functions, store and look up users, build reusable auth helpers, and debug issues. Use these patterns to keep auth consistent across your Convex backend.

How This Skill Works

Access the authenticated user with ctx.auth.getUserIdentity() inside queries, mutations, and actions. The identity object exposes tokenIdentifier, subject, issuer, email, name, and more, which you can rely on to enforce access and gate logic. The skill also demonstrates race-condition prevention with Convex auth utilities, client-side guards (useConvexAuth, Authenticated/Unauthenticated), and custom wrappers (authQuery, authMutation, authAction) to centralize authenticated access.

When to Use It

  • When implementing auth checks in Convex functions (queries, mutations, actions).
  • When storing or looking up users in the database (via client mutations or webhooks).
  • When building reusable auth helpers or wrappers to enforce authentication.
  • When debugging auth issues or race-condition timing on page load.
  • When integrating with any external auth provider (Clerk, Auth0, WorkOS, etc.).

Quick Start

  1. Step 1: In server code, fetch the authenticated user with ctx.auth.getUserIdentity() and handle null as not authenticated.
  2. Step 2: On the client, use useConvexAuth() and Convex Auth components to ensure tokens are validated before rendering protected content.
  3. Step 3: Create and export authenticated wrappers (authQuery, authMutation, authAction) to protect your server functions and reuse the pattern.

Best Practices

  • Always fetch identity with ctx.auth.getUserIdentity() and treat a null value as Not authenticated.
  • Prevent race conditions by using Convex auth hooks/components (useConvexAuth, Authenticated/Unauthenticated/AuthLoading) and skip queries until authenticated.
  • Wrap protected server functions with custom wrappers (authQuery, authMutation, authAction) for consistent auth checks.
  • Store and manage user records using patterns from USERS.md (including webhooks for production).
  • Inspect identity fields (tokenIdentifier, subject, issuer, email, name) to ensure provider compatibility and consistent access control.

Example Use Cases

  • Query handler checks identity and throws Not authenticated if missing.
  • Client renders using Authenticated/Unauthenticated wrappers to guard UI and data fetching.
  • Query/Mutation is guarded by a custom wrapper (authQuery/authMutation) to require authentication.
  • Skip a data fetch until isAuthenticated is true to avoid race conditions.
  • Store user records via a mutation or webhook after successful login for downstream lookups.

Frequently Asked Questions

Add this skill to your agents
Sponsor this space

Reach thousands of developers