Securely embed Whoprompt analytics into your application using JWT authentication.
Whoprompt uses JSON Web Tokens (JWT) to securely authenticate your users. This ensures that your users only see the data they are authorized to access, without requiring them to have a separate Whoprompt account.
You need to generate a JWT on your server for each user session. This token must be signed with your Tenant Secret.
import jwt from 'jsonwebtoken';
// 1. Get your secret from Dashboard > Integration & API
const JWT_SECRET = process.env.WHOPROMPT_JWT_SECRET;
const TENANT_ID = 'YOUR_TENANT_ID';
// 2. Sign a token for your user
function generateWhopromptToken(user) {
const payload = {
iss: 'your-app-name',
sub: user.id, // Your user's ID
aud: 'whoprompt-widget',
tid: TENANT_ID, // Your Tenant ID
// Optional: User context for RLS
ctx: {
role: user.role,
orgId: user.orgId
}
};
return jwt.sign(payload, JWT_SECRET, {
algorithm: 'HS256',
expiresIn: '1h'
});
}Once you have the token, you can simply add the SDK script and use the web component.
<!-- 1. Add the SDK Script -->
<script src="https://cdn.whoprompt.com/whoprompt-component.js" async></script>
<!-- 2. Use the Web Component -->
<whoprompt-widget
token="YOUR_JWT_TOKEN"
user-id="user_123"
connection-id="conn_123" <!-- Optional -->
></whoprompt-widget>You can also embed the full analytics dashboard.
Universal method (HTML, Vue, Svelte, etc).
<div style="height: 600px;">
<whoprompt-dashboard></whoprompt-dashboard>
</div>