Chat SDK
Intégration Vue hors chat
Utiliser fetchAdForContent dans les apps Vue/Nuxt où la majorité des surfaces ne sont pas des messages de chat
Intégration Vue hors chat
Si 90% de votre UI est hors chat, vous pouvez récupérer les ads depuis des blocs de contenu au lieu de messages.
Exemple de base
<script setup lang="ts">
import { onMounted } from 'vue';
import { useIdlenAd } from '@idlen/chat-sdk/vue';
const { ad, loading, error, fetchAdForContent, trackClick } = useIdlenAd({
apiKey: 'idl_pk_...'
});
onMounted(async () => {
await fetchAdForContent({
sessionId: 'docs-page-42',
contentText: `
Comment déployer des apps Nuxt avec previews,
analytics et stratégie de rollout progressive.
`
});
});
</script>
<template>
<aside v-if="ad">
<a :href="ad.ctaUrl" @click="trackClick">{{ ad.title }}</a>
</aside>
<p v-else-if="loading">Chargement de l'ad...</p>
<p v-else-if="error">Impossible de charger l'ad.</p>
</template>
Quand utiliser chaque méthode
fetchAd({ rawText, sessionId }): interfaces de chat/conversationfetchAdForContent({ contentText, sessionId }): docs, articles, pages produit, dashboards
Contexte manuel (optionnel)
Si vous calculez déjà le contexte, vous pouvez l’envoyer directement :
await fetchAdForContent({
sessionId: 'page-42',
context: {
topics: ['nuxt', 'vercel'],
intent: 'informational',
category: 'devtools'
}
});