web-auth
Implementar autenticación web en React
Los equipos de React necesitan flujos de autenticación seguros que gestionen correctamente sesiones, redirecciones, OAuth y renovación de tokens. Esta skill ofrece a Claude, Codex y Claude Code patrones prácticos para construir esos flujos en aplicaciones web.
Instalar con mi Agente
Copia esta solicitud en tu Agente. Incluye la página canónica del Skill y el manifiesto.
Review the Skillstore skill "web-auth" from https://skillstore.io/skills/cjharmath-web-auth.md and its manifest at https://skillstore.io/api/skills/cjharmath-web-auth/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Tu Agente debe seguir mostrando su plan y solicitar cualquier confirmación exigida por la política de seguridad.
Recursos legibles por agentes
Usa estos enlaces cuando un agente de IA, crawler o script necesite contexto limpio en vez de leer la página completa.
Pruébalo
Usando "web-auth". Necesito inicio y cierre de sesión en una aplicación React usando cookies.
Resultado esperado:
Un plan de implementación conciso con un cliente de API, proveedor de autenticación, estado de carga, conexión del formulario de inicio de sesión y limpieza al cerrar sesión.
Usando "web-auth". Quiero agregar inicio de sesión con Google a una aplicación Next.js.
Resultado esperado:
Guía de configuración del proveedor, nombres de variables de entorno, comportamiento de callbacks, manejo de sesión y pasos para proteger el panel.
Usando "web-auth". Revisa mi flujo de autenticación para detectar brechas de seguridad comunes.
Resultado esperado:
Una revisión priorizada que cubre almacenamiento de tokens, encabezados CSRF, configuración de cookies, reintentos de renovación, guardias de rutas y manejo de errores.
Auditoría de seguridad
SeguroAll static findings were reviewed against SKILL.md. The command alerts are Markdown code fences, and the network, environment, sensitive, and reconnaissance alerts are non-executed authentication examples. No prompt injection, malicious intent, or credential exfiltration evidence was found.
Factores de riesgo
⚙️ Comandos externos (27)
🌐 Acceso a red (10)
🔑 Variables de entorno (6)
Compartir y citar este informe
Comparte el informe de evaluación versionado, la insignia neutral, la tarjeta insertable y las citas. Skillstore presenta evidencias sin decidir si este Skill es seguro.
Copiar enlace del informe
https://skillstore.io/skills/cjharmath-web-auth/audits/7?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportInsignia Markdown
[](https://skillstore.io/skills/cjharmath-web-auth?utm_source=security_passport_badge)Insignia HTML
<a href="https://skillstore.io/skills/cjharmath-web-auth?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/cjharmath-web-auth/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Tarjeta para insertar
<iframe src="https://skillstore.io/embed/skills/cjharmath-web-auth.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Citas académicas (APA · BibTeX · CFF)
Cita APA
CJHarmath. (2026). web-auth security audit report (audit version 7) [Author version unspecified]. Skillstore. https://skillstore.io/skills/cjharmath-web-auth/audits/7Cita BibTeX
@techreport{cjharmath-cjharmath-web-auth-2026,
author = {CJHarmath},
title = {web-auth security audit report (audit version 7)},
institution = {Skillstore},
year = {2026},
number = {7},
url = {https://skillstore.io/skills/cjharmath-web-auth/audits/7},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "web-auth security audit report (audit version 7)"
version: "unspecified"
type: report
authors:
- name: "CJHarmath"
date-released: "2026-07-05"
url: "https://skillstore.io/skills/cjharmath-web-auth/audits/7"
identifiers:
- type: other
value: "skillstore:cjharmath-web-auth:audit:7"
description: "Skillstore immutable audit report identifier"
Puntuación de Skillstore
Por qué esta puntuación Confianza de la evidencia: AltoLo que puedes crear
Agregar inicio de sesión a una aplicación React
Crea un flujo de inicio de sesión con sesiones respaldadas por cookies, carga del usuario actual y comportamiento de cierre de sesión.
Configurar OAuth en Next.js
Configura Google OAuth o NextAuth.js con callbacks de proveedor y acceso a la sesión en componentes.
Reforzar la UX de autenticación
Agrega rutas protegidas, renovación de tokens, validación de formularios, encabezados CSRF y encabezados de respuesta de seguridad.
Prueba estos prompts
Usa la skill web-auth para crear un contexto de autenticación de React para inicio de sesión, cierre de sesión, carga del usuario actual y comprobaciones de rutas protegidas.
Usa la skill web-auth para diseñar un flujo de inicio de sesión, cierre de sesión y renovación basado en cookies para mi aplicación React y API.
Usa la skill web-auth para agregar Google OAuth a una aplicación Next.js con NextAuth.js, callbacks y páginas de panel protegidas.
Usa la skill web-auth para revisar mi flujo de autenticación en React en cuanto a almacenamiento de tokens, manejo de CSRF, protección de rutas y comportamiento de renovación.
Mejores prácticas
- Prefiere cookies httpOnly seguras para tokens de sesión de larga duración cuando el backend las admita.
- Combina la autenticación con cookies con protección CSRF y manejo explícito de credenciales en las solicitudes.
- Protege las rutas tanto en el cliente como en el servidor cuando el framework admita comprobaciones del servidor.
Evitar
- No almacenes tokens de acceso de larga duración en localStorage sin aceptar la exposición a XSS.
- No confíes en una guardia de ruta del cliente como único control de autorización.
- No expongas secretos de cliente OAuth en código del navegador ni en variables de entorno públicas.