## Configurar el ejemplo
@@ -221,6 +221,19 @@ export function AssistantWidget({ domain, docsURL }) {
```
+
+
+El ejemplo expone tu clave de API del assistant en el navegador, lo cual está bien para el desarrollo local, pero no es seguro para producción. Antes de desplegar, mueve la clave a tu propio backend:
+
+1. Almacena `VITE_MINTLIFY_TOKEN` como variable de entorno del lado del servidor, no como una variable con prefijo `VITE_` que se incluya en el bundle del cliente.
+2. Añade una ruta de backend (por ejemplo, `/api/assistant`) que acepte el mensaje del usuario, agregue la cabecera `Authorization: Bearer mint_dsc_...` y reenvíe la solicitud a `https://api.mintlify.com/discovery/v1/assistant/{domain}/message`.
+3. Transmite la respuesta de la API de origen al cliente sin modificarla, para que el streaming de tokens y las cabeceras `X-Thread-Id` / `X-Thread-Key` lleguen al widget.
+4. Apunta la opción `api` del widget a tu ruta de backend en lugar de a la API de Mintlify directamente.
+
+Esto mantiene la clave en tu servidor, te permite añadir limitación de tasa y autenticación, y evita el abuso por parte de visitantes anónimos.
+
diff --git a/fr/guides/assistant-embed.mdx b/fr/guides/assistant-embed.mdx
index e3f0b83ad..7029f7e0e 100644
--- a/fr/guides/assistant-embed.mdx
+++ b/fr/guides/assistant-embed.mdx
@@ -39,9 +39,9 @@ Les utilisateurs peuvent utiliser le widget pour obtenir de l’aide sur votre p
2. Cliquez sur **Create Assistant API Key**.
3. Copiez la clé d’API Assistant (commence par `mint_dsc_`) et conservez-la en lieu sûr.
-
## Configurer l’exemple
@@ -221,6 +221,19 @@ export function AssistantWidget({ domain, docsURL }) {
```
+
+ ### Déploiement en production
+
+
+L'exemple expose votre clé d'API Assistant dans le navigateur, ce qui convient au développement local, mais n'est pas sûr pour la mise en production. Avant le déploiement, déplacez la clé derrière votre propre backend :
+
+1. Stockez `VITE_MINTLIFY_TOKEN` en tant que variable d'environnement côté serveur, et non comme une variable préfixée par `VITE_` qui serait incluse dans le bundle client.
+2. Ajoutez une route de backend (par exemple, `/api/assistant`) qui accepte le message de l'utilisateur, joint l'en-tête `Authorization: Bearer mint_dsc_...` et transmet la requête à `https://api.mintlify.com/discovery/v1/assistant/{domain}/message`.
+3. Diffusez la réponse de l'API en amont vers le client sans la modifier, afin que le streaming des tokens et les en-têtes `X-Thread-Id` / `X-Thread-Key` parviennent au widget.
+4. Faites pointer l'option `api` du widget vers votre route de backend plutôt que directement vers l'API Mintlify.
+
+Cela conserve la clé sur votre serveur, vous permet d'ajouter une limitation de débit et une authentification, et empêche les abus de la part des visiteurs anonymes.
+
### Ajouter des raccourcis clavier
From 2cbf1ce29bad4a0a0832fe7a16dfb06a06a9cb3f Mon Sep 17 00:00:00 2001
From: Ethan Palm <56270045+ethanpalm@users.noreply.github.com>
Date: Wed, 17 Jun 2026 11:00:23 -0700
Subject: [PATCH 3/3] update steps for not exposing api key
---
es/guides/assistant-embed.mdx | 19 +++----------------
fr/guides/assistant-embed.mdx | 19 +++----------------
guides/assistant-embed.mdx | 35 ++++++++++++++---------------------
3 files changed, 20 insertions(+), 53 deletions(-)
diff --git a/es/guides/assistant-embed.mdx b/es/guides/assistant-embed.mdx
index 3e0c1d008..c423886c8 100644
--- a/es/guides/assistant-embed.mdx
+++ b/es/guides/assistant-embed.mdx
@@ -39,9 +39,9 @@ Los usuarios pueden usar el widget para obtener ayuda con tu producto sin salir
2. Haz clic en **Create Assistant API Key**.
3. Copia la clave de API del assistant (comienza con `mint_dsc_`) y guárdala de forma segura.
-
- No incrustes tu clave de API del assistant directamente en el código del lado del cliente en producción. Cualquiera que extraiga la clave puede enviar solicitudes en tu nombre, consumiendo créditos y generando potencialmente cargos por excedente. Usa la clave de este tutorial para desarrollo local y, antes de desplegar, redirige las solicitudes a través de tu propio backend. Consulta [Despliegue en producción](#production-deployment) más abajo.
-
+
+ La clave de API del assistant es un token público que puedes usar en el código del frontend. Las llamadas que usen este token se contabilizan en la cuota de mensajes de tu plan y pueden generar cargos por excedente.
+
## Configurar el ejemplo
@@ -221,19 +221,6 @@ export function AssistantWidget({ domain, docsURL }) {
```
-
- ### Despliegue en producción
-
-
-El ejemplo expone tu clave de API del assistant en el navegador, lo cual está bien para el desarrollo local, pero no es seguro para producción. Antes de desplegar, mueve la clave a tu propio backend:
-
-1. Almacena `VITE_MINTLIFY_TOKEN` como variable de entorno del lado del servidor, no como una variable con prefijo `VITE_` que se incluya en el bundle del cliente.
-2. Añade una ruta de backend (por ejemplo, `/api/assistant`) que acepte el mensaje del usuario, agregue la cabecera `Authorization: Bearer mint_dsc_...` y reenvíe la solicitud a `https://api.mintlify.com/discovery/v1/assistant/{domain}/message`.
-3. Transmite la respuesta de la API de origen al cliente sin modificarla, para que el streaming de tokens y las cabeceras `X-Thread-Id` / `X-Thread-Key` lleguen al widget.
-4. Apunta la opción `api` del widget a tu ruta de backend en lugar de a la API de Mintlify directamente.
-
-Esto mantiene la clave en tu servidor, te permite añadir limitación de tasa y autenticación, y evita el abuso por parte de visitantes anónimos.
-
### Añadir atajos de teclado
diff --git a/fr/guides/assistant-embed.mdx b/fr/guides/assistant-embed.mdx
index 7029f7e0e..e3f0b83ad 100644
--- a/fr/guides/assistant-embed.mdx
+++ b/fr/guides/assistant-embed.mdx
@@ -39,9 +39,9 @@ Les utilisateurs peuvent utiliser le widget pour obtenir de l’aide sur votre p
2. Cliquez sur **Create Assistant API Key**.
3. Copiez la clé d’API Assistant (commence par `mint_dsc_`) et conservez-la en lieu sûr.
-
- N'intégrez pas votre clé d'API Assistant directement dans le code côté client en production. Toute personne qui en extrait la clé peut envoyer des requêtes en votre nom, consommer des crédits et potentiellement déclencher des frais de dépassement. Utilisez la clé de ce tutoriel pour le développement local, puis acheminez les requêtes via votre propre backend avant le déploiement. Consultez [Déploiement en production](#production-deployment) ci-dessous.
-
+
+ La clé d’API Assistant est un jeton public que vous pouvez utiliser dans le code frontend. Les appels effectués avec ce jeton sont décomptés de l’allocation de messages de votre offre et peuvent entraîner des dépassements.
+
## Configurer l’exemple
@@ -221,19 +221,6 @@ export function AssistantWidget({ domain, docsURL }) {
```
-
- ### Déploiement en production
-
-
-L'exemple expose votre clé d'API Assistant dans le navigateur, ce qui convient au développement local, mais n'est pas sûr pour la mise en production. Avant le déploiement, déplacez la clé derrière votre propre backend :
-
-1. Stockez `VITE_MINTLIFY_TOKEN` en tant que variable d'environnement côté serveur, et non comme une variable préfixée par `VITE_` qui serait incluse dans le bundle client.
-2. Ajoutez une route de backend (par exemple, `/api/assistant`) qui accepte le message de l'utilisateur, joint l'en-tête `Authorization: Bearer mint_dsc_...` et transmet la requête à `https://api.mintlify.com/discovery/v1/assistant/{domain}/message`.
-3. Diffusez la réponse de l'API en amont vers le client sans la modifier, afin que le streaming des tokens et les en-têtes `X-Thread-Id` / `X-Thread-Key` parviennent au widget.
-4. Faites pointer l'option `api` du widget vers votre route de backend plutôt que directement vers l'API Mintlify.
-
-Cela conserve la clé sur votre serveur, vous permet d'ajouter une limitation de débit et une authentification, et empêche les abus de la part des visiteurs anonymes.
-
### Ajouter des raccourcis clavier
diff --git a/guides/assistant-embed.mdx b/guides/assistant-embed.mdx
index cb69e30c5..2224f8521 100644
--- a/guides/assistant-embed.mdx
+++ b/guides/assistant-embed.mdx
@@ -33,9 +33,9 @@ Users can use the widget to get help with your product without leaving your appl
2. Click **Create Assistant API Key**.
3. Copy the assistant API key (starts with `mint_dsc_`) and save it securely.
-
- Do not embed your assistant API key directly in client-side code in production. Anyone who extracts the key can send requests on your behalf, consuming credits and potentially triggering overage charges. Use the key in this tutorial for local development, then proxy requests through your own backend before deploying. See [Production deployment](#production-deployment) below.
-
+
+ Your assistant API key controls access to your assistant quota. This tutorial keeps the key server-side using a backend proxy so it never reaches the client bundle.
+
## Set up the example
@@ -81,16 +81,23 @@ Replace:
- `https://yourdocs.mintlify.app` with your actual documentation URL.
-
+
-Create a `.env` file in the project root.
+Store your assistant API key as a server-side environment variable. Avoid the `VITE_` prefix, which bundles the value into your client code:
```bash .env
-VITE_MINTLIFY_TOKEN=mint_dsc_your_token_here
+MINTLIFY_TOKEN=mint_dsc_your_token_here
```
Replace `mint_dsc_your_token_here` with your assistant API key.
+Then add a backend route (for example, `/api/assistant`) to proxy requests to the Mintlify API:
+
+1. Accept the user's message from the widget.
+2. Attach the `Authorization: Bearer $MINTLIFY_TOKEN` header and forward the request to `https://api.mintlify.com/discovery/v1/assistant/{domain}/message`.
+3. Stream the upstream response back to the client unchanged, so token streaming and `X-Thread-Id` / `X-Thread-Key` headers reach the widget.
+4. Point the widget's `api` option at your backend route instead of the Mintlify API directly.
+
@@ -174,10 +181,7 @@ export function AssistantWidget({ domain, docsURL }) {
}, []);
const { messages, input, handleInputChange, handleSubmit, isLoading } = useChat({
- api: `https://api.mintlify.com/discovery/v1/assistant/${domain}/message`,
- headers: {
- 'Authorization': `Bearer ${import.meta.env.VITE_MINTLIFY_TOKEN}`,
- },
+ api: '/api/assistant',
body: {
fp: 'anonymous',
retrievalPageSize: 5,
@@ -206,17 +210,6 @@ export function AssistantWidget({ domain, docsURL }) {
}
```
-### Production deployment
-
-The example exposes your assistant API key in the browser, which is fine for local development but unsafe to ship. Before deploying, move the key behind your own backend:
-
-1. Store `VITE_MINTLIFY_TOKEN` as a server-side environment variable, not a `VITE_`-prefixed variable that gets bundled with the client.
-2. Add a backend route (for example, `/api/assistant`) that accepts the user's message, attaches the `Authorization: Bearer mint_dsc_...` header, and forwards the request to `https://api.mintlify.com/discovery/v1/assistant/{domain}/message`.
-3. Stream the response from the upstream API back to the client unchanged so token streaming and `X-Thread-Id` / `X-Thread-Key` headers reach the widget.
-4. Point the widget's `api` option at your backend route instead of the Mintlify API directly.
-
-This keeps the key on your server, lets you add rate limiting and authentication, and prevents abuse from anonymous visitors.
-
### Add keyboard shortcuts
Allow users to open the widget and submit messages with keyboard shortcuts: