Cita a partir de mañana
Agendar revisión
99 €
Elegimos hueco, miro tu app con calma y te digo qué pasa y cómo se arregla.
- Sesión de trabajo en directo contigo
- Diagnóstico del error y del riesgo real
- Te quedas con el arreglo aplicado
Puse el prefijo VITE_ o NEXT_PUBLIC_ a un secreto y se publicó
Esos prefijos no son un formalismo del nombre: son una instrucción. Le dicen a la herramienta que construye tu app que esa variable debe copiarse dentro del código que se descarga el navegador. Ponerle ese prefijo a un secreto es, literalmente, pedir que se publique.
Compruébalo en tu app ahora, gratis
Esto no da la cara solo: tu app funciona igual de bien esté abierta o cerrada. La única forma de saberlo es mirar.
Solo leemos lo que tu app ya le entrega a cualquier visitante.
Por qué te pasa
Por una trampa perfecta. Una variable sin prefijo no llega al navegador, así que la app da un error diciendo que falta. Se busca el error, y todo el mundo, documentación incluida, responde lo mismo: ponle el prefijo. Se pone, el error desaparece, la app funciona. Y si esa variable era un secreto, acaba de quedar publicada. La solución correcta para una clave pública es exactamente la equivocada para una privada, y el síntoma es idéntico.
El motivo de fondo es que el navegador no puede guardar secretos. Todo lo que necesita el código que se ejecuta en el navegador tiene que viajar hasta él, y por tanto es legible. Cuando una operación necesita una credencial de verdad, la respuesta no es hacérsela llegar al navegador: es que esa operación no debe ocurrir en el navegador.
Estas son las que nunca deben llevar prefijo, pase lo que pase: la service_role de Supabase, cualquier clave secreta de Stripe, las claves de OpenAI o de cualquier proveedor de IA, las credenciales de AWS, las contraseñas de correo saliente y los secretos de firma de webhooks. Si alguna de estas tiene prefijo hoy, está publicada.
Lo que este error no significa
- No significa que todos los prefijos estén mal. La dirección de tu proyecto de Supabase y su clave pública deben llevarlo: es su sitio y no pasa absolutamente nada porque se vean.
- No significa que hayas hecho una barbaridad. Es el error de configuración más común que existe en apps hechas con IA, precisamente porque la pista falsa está en todas partes.
- No se arregla solo quitando el prefijo. La clave ya ha estado publicada y hay que darla por comprometida: quitarla de la web de hoy no se la quita a quien la copiara ayer.
Arréglalo tú, gratis
Primero averigua qué se ha publicado exactamente, luego decide, y solo al final toca. El escáner de arriba te contesta a la primera parte en treinta segundos, pero puedes comprobarlo tú mismo a mano.
- 1Abre tu app publicada, pulsa F12 y ve a la pestaña Network. Recarga, filtra por ficheros JS y abre el más grande. Busca dentro con el buscador cadenas como sk_live, sk-, service_role o AKIA. Si aparece alguna, está publicada.
- 2Entra en el panel de tu hosting y repasa la lista entera de variables de entorno. Marca todas las que lleven prefijo y contengan algo que no sea una dirección o una clave pública.
- 3Por cada una de esas, ve al servicio que la emitió y revoca o regenera la credencial. Este paso no es opcional ni se puede posponer: mientras la clave siga siendo válida, sigue publicada en internet aunque tú ya la hayas borrado del panel.
- 4Vuelve a dar de alta cada credencial sin el prefijo. Así deja de llegar al navegador, y con ella dejará de funcionar el código que la usaba desde ahí: eso es lo esperado, y significa que esa operación tiene que mudarse a un servidor.
- 5Despliega de nuevo y repite la comprobación del primer paso sobre el bundle nuevo. Si la cadena ya no aparece, ha salido del navegador.
- 6Por último, entra en cada servicio afectado y mira el consumo o la actividad de los últimos días. En las claves de IA y de pago esto es lo que te dice si alguien llegó a usarla, y es la parte que más gente se salta.
Si al quitar el prefijo se rompe una parte de la app, no vuelvas a ponerlo. Que se rompa es la prueba de que esa operación se estaba haciendo desde el navegador con una credencial que no debía estar ahí.
Y esto para la parte de código
Pégaselo tal cual al agente que escribió tu app. Está redactado para que te diga lo que ha hecho, no solo para que lo haga.
Prompt para pegarle a tu agente
En mi app hay variables de entorno con prefijo VITE_ o NEXT_PUBLIC_ que contienen secretos, y por tanto se están publicando en el código del navegador. Necesito que hagas esto: 1. Lista todas las variables de entorno que usa el proyecto, separadas en dos grupos: las que llegan al navegador por llevar prefijo y las que no. Dime para qué se usa cada una. 2. Señálame cuáles del primer grupo son credenciales que no deberían ser públicas. No me pegues sus valores. 3. Por cada una de esas, dime exactamente qué parte del código la usa y qué hace, y propón cómo mover esa operación a una función de servidor para que la credencial deje de necesitarse en el navegador. 4. Prepara el código para leer esas credenciales desde variables sin prefijo, y deja escrito en el fichero .env.example qué variable va en cada sitio, con un comentario que diga cuáles no deben llevar prefijo nunca. No revoques nada tú ni me digas que basta con renombrar la variable: las claves ya publicadas las roto yo en cada servicio.
Si el escáner ha encontrado algo, no lo toques con prisa
Cerrar una puerta abierta tiene un orden: primero se corta el acceso, después se comprueba en los registros si alguien entró, y solo entonces se despliega. Hacerlo al revés deja la app caída y borra el rastro de lo que pasó. Si prefieres no hacerlo solo, elige cuándo lo hacemos.
Hoy, en cola prioritaria
Rescate exprés
199 €
Entras en la cola de hoy. Reservas hueco y lo dejamos resuelto en el día.
- Hueco el mismo día
- Prioridad sobre las revisiones agendadas
- Mismo trabajo, antes
Quién lo arregla
Marc Sala
IT Manager
- Analista de ciberseguridad certificado por Google
No es un rating anónimo de un marketplace: es la persona que va a entrar en tu app. Reviso el código, encuentro qué falla y lo arreglo contigo delante.
Errores que suelen venir con este
- La clave service_role de Supabase está en el código públicoSupabase te da dos llaves. Una es pública y va en el navegador a propósito. La otra, la service_role, se salta todas las reglas de seguridad de tu base de datos y solo debe vivir en un servidor. La segunda ha acabado dentro del código que se descarga cualquiera que visite tu web.
- Mi clave de Stripe está en el código públicoStripe te da dos claves y solo una de ellas es un secreto. La publicable, que empieza por pk_, va en el navegador a propósito para que funcione el formulario de pago. La secreta, que empieza por sk_, permite cobrar, devolver dinero y leer los datos de tus clientes. Si la que está en tu código empieza por sk_, ese es el problema.
- Mi clave de OpenAI o de otro proveedor de IA está expuestaLa clave que usa tu app para hablar con OpenAI, Anthropic o el proveedor que sea está dentro del código que se descarga cualquiera que visite tu web. Esa clave no protege datos: autoriza gasto contra tu tarjeta.