Le widget Votecove : recueillir le feedback dans ton application, avec ou sans SSO

Un utilisateur pense à une amélioration pendant qu’il se sert de ton produit, rarement trois jours plus tard devant un formulaire. Le widget Votecove est fait pour ce moment-là : un bouton 💡 Feedback en bas de ton application, qui ouvre une fenêtre où l’on consulte les idées, vote et propose, sans quitter la page. Il est inclus dans toutes les offres, y compris la gratuite.

Installer le widget en une ligne

1. Dans Votecove, ouvre Réglages → Intégrations.
2. Copie le code proposé et colle-le juste avant </body> sur les pages de ton application :

<script src="https://votecove.com/widget.js" data-workspace="mon-saas" async></script>

Le script pèse environ 3 Ko, se charge de façon asynchrone et n’ajoute qu’un bouton et, au clic, une fenêtre.

Les options

Tout se règle avec des attributs data- sur la balise :

• data-workspace (obligatoire) : l’adresse de ton espace ;
• data-label : le texte du bouton (par défaut « Feedback ») ;
• data-color : la couleur du bouton, par exemple #e0242b ;
• data-position : right (par défaut) ou left ;
• data-token : le jeton qui identifie l’utilisateur connecté (voir le SSO plus bas).

À l’intérieur de la fenêtre, tes utilisateurs retrouvent l’essentiel du portail : la liste des idées, la recherche, le tri (les plus votées, tendance, les plus récentes), les statuts, les votes et le formulaire Proposer. Un lien ↗ ouvre le portail complet dans un nouvel onglet.

Trois façons de participer

Le visiteur anonyme

Sans rien faire, un visiteur voit les idées et peut en proposer une anonymement. Sur un site public ou une page de tarifs, tu recueilles ainsi des idées de personnes qui n’ont pas encore de compte. Un champ piège invisible arrête les robots de spam.

Le compte Votecove

Pour voter, un visiteur peut se connecter à un compte Votecove. Au clic sur Se connecter, une fenêtre s’ouvre sur votecove.com, avec l’adresse bien visible : il s’y connecte ou crée son compte, puis la fenêtre se ferme et le widget le reconnaît. Aucun mot de passe n’est jamais saisi dans le widget affiché sur ton site : c’est plus sûr pour tes utilisateurs, et cela évite que ton site ressemble à une page qui collecte des identifiants.

L’utilisateur identifié par SSO

Avec le SSO, tes utilisateurs votent avec leur compte de ton application, sans inscription ni connexion supplémentaire. Tu sais exactement qui vote, et tu peux même transmettre leur revenu.

Mettre en place le SSO en 3 étapes

1. Récupère ta clé secrète

Dans Réglages → Intégrations, affiche la clé secrète SSO. Elle reste sur ton serveur : ne la mets jamais dans le code envoyé au navigateur.

2. Signe un jeton JWT (HS256) côté serveur

Le jeton contient :

• id (obligatoire) : l’identifiant de l’utilisateur chez toi ;
• exp (obligatoire) : la date d’expiration, dans moins de 7 jours ;
• email, name, avatar (facultatifs) ;
• mrr (facultatif) : le revenu mensuel de ce client, en euros.

En Node.js :

import jwt from 'jsonwebtoken';
const token = jwt.sign({ id: user.id, email: user.email, name: user.name, mrr: 49 }, process.env.VOTECOVE_SECRET, { algorithm: 'HS256', expiresIn: '1h' });

En PHP, sans bibliothèque :

$b64 = fn ($s) => rtrim(strtr(base64_encode($s), '+/', '-_'), '=');
$data = $b64(json_encode(['alg' => 'HS256', 'typ' => 'JWT'])).'.'.$b64(json_encode([
    'id' => $user->id, 'email' => $user->email, 'name' => $user->name, 'exp' => time() + 3600,
]));
$token = $data.'.'.$b64(hash_hmac('sha256', $data, getenv('VOTECOVE_SECRET'), true));

3. Passe le jeton au widget

Mets-le dans data-token, ou appelle Votecove.identify(token) une fois l’utilisateur connecté. Le jeton n’apparaît jamais dans une adresse : le widget le transmet à sa fenêtre par un canal réservé à votecove.com.

L’API JavaScript

Pour les applications monopages (React, Vue, Svelte…), le widget expose trois fonctions :

• Votecove.open() : ouvre la fenêtre, par exemple depuis ton propre lien « Proposer une idée » dans un menu ;
• Votecove.close() : la ferme ;
• Votecove.identify(token) : identifie l’utilisateur après sa connexion, et Votecove.identify('') à sa déconnexion.

Sécurité : ce qu’il faut savoir

• Les utilisateurs SSO sont propres à ton espace. Ils ne peuvent pas se connecter à Votecove et ne peuvent pas prendre la place d’un compte existant, même avec le même e-mail.
• Si ta clé a fuité, Générer une nouvelle clé invalide immédiatement l’ancienne.
• Un compte Votecove connecté dans le widget reçoit un jeton valable uniquement pour ton espace.