auth

Configure Google OAuth and secure cookies in Next.js App Router applications.

Updated Apr 13, 2026
One-click install
npx skills add https://github.com/angrybeagles/weather-dashboard --skill auth-angrybeagles
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: auth
Source: https://github.com/angrybeagles/weather-dashboard/tree/main/.claude/skills/auth
Command: npx skills add https://github.com/angrybeagles/weather-dashboard --skill auth-angrybeagles

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Addresses OAuth redirects, session management, and environment-scope pitfalls in Next.js App Router apps. Specifically, it tackles the build-time inlining issue caused by NEXT_PUBLIC_* variables that bakes localhost URLs into production bundles and provides guidance for runtime URL detection, dynamic base URLs, and secure cookie handling across development and production. It also outlines CSP considerations and Google OAuth configuration to prevent login failures.

Core Features & Use Cases

  • Dynamic client/server URL detection to avoid build-time inlining (use window.location.origin on the client and BETTER_AUTH_URL (runtime) on the server).
  • Google OAuth integration with proper redirect URIs, CSP, and trusted origins, plus Safe cookie attributes (SameSite lax and secure flag controlled by environment).
  • API route integration with Next.js using toNextJsHandler for unified auth endpoints and a server-side session getter.
  • Guidance for diagnosing and fixing common auth issues (redirect mismatches, session persistence, and production readiness).

Quick Start

Configure BETTER_AUTH_URL in production, set up Google OAuth credentials, and run the app to enable a robust, production-ready Next.js App Router authentication flow.

Frequently Asked Questions about auth

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Why does my Next.js App Router OAuth redirect to localhost in production?

Next.js App Router OAuth redirects to localhost because NEXT_PUBLIC_* variables inline build-time URLs into production bundles. Use runtime URL detection with window.location.origin on the client and BETTER_AUTH_URL on the server to fix this.

How do I configure Google OAuth redirect URIs for a Next.js App Router application?

Configure Google OAuth redirect URIs in Next.js App Router by setting up Google OAuth credentials, establishing trusted origins, and applying proper Content Security Policy headers for Google OAuth domains to prevent login failures.

What cookie attributes are required for secure OAuth session management in Next.js?

Secure OAuth session management in Next.js requires setting SameSite to lax and configuring the secure flag based on the environment to ensure cookies are handled safely across development and production.

Can I use window.location.origin for dynamic base URLs in a Next.js server component?

You cannot use window.location.origin in a Next.js server component because it is a client-side API. Use the BETTER_AUTH_URL environment variable for runtime URL detection on the server side instead.

How do I expose API endpoints for authentication in Next.js App Router?

Expose authentication API endpoints in Next.js App Router by exporting a route handler using toNextJsHandler, which creates unified auth endpoints and includes a server-side session getter.