Custom 500 page is present and does not expose internals

The default framework error page in production often renders stack traces, internal file paths, and framework version information directly in the browser — feeding an attacker a precise map of the application's internal structure (CWE-209). OWASP A05 lists this as a Security Misconfiguration. Equally important: an error page that shows a friendly message but discards the error object silently means production failures are invisible. You need both — a safe user-facing message and server-side error capture so you know the failure happened.

Create app/error.tsx and app/global-error.tsx. Log the error server-side or to your monitoring service; show only a generic message to the user. Never render error.message or error.stack in the UI.

// app/error.tsx
'use client'
import { useEffect } from 'react'

export default function Error({
  error, reset,
}: { error: Error & { digest?: string }; reset: () => void }) {
  useEffect(() => { console.error(error) }, [error])
  return (
    <main>
      <h1>Something went wrong</h1>
      <p>We've been notified and are working on a fix.</p>
      <button onClick={() => reset()}>Try again</button>
    </main>
  )
}

Replace console.error with your monitoring service SDK (Sentry, Bugsnag) for production alerting. The digest prop is a safe server-side error ID you can log — it never exposes the original stack trace to the client.