​
Prerequisites

  • Cekura API key
  • Agent ID
  • Development environment for your chosen framework

​
URL Structure

The embed URL follows this pattern: 
https://dashboard.cekura.ai/embed/{agentId}/result/{resultId}?token={token}&theme={theme}
Where:
  • {agentId}: Your agent’s unique identifier
  • {resultId}: Either ‘all’ to view all results, or a specific result ID
  • {token}: Your authentication token
  • {theme}: Theme preference (‘dark’ or ‘light’)

​
Framework Implementations

import { useEffect, useState } from 'react';

const VoceraEmbed = ({ agentId, resultId = 'all', theme = 'light' }) => {
const [token, setToken] = useState(null);
const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState(null);

useEffect(() => {
const handleMessage = async (event) => {
// Token expired event
if (event.data === 'token_expired') {
try {
await refreshToken(); // See /embed/refreshing-expired-token for implementation
} catch (err) {
setError('Failed to refresh token');
}
}

    };

    const initializeToken = async () => {
      try {
        const newToken = await initToken(); // See /embed/generate-token for implementation
        setToken(newToken);
      } catch (err) {
        setError('Failed to initialize token');
      }
    };

    window.addEventListener('message', handleMessage);
    initializeToken();

    return () => window.removeEventListener('message', handleMessage);

}, [agentId, resultId]);

if (error) return <div className="error-message">{error}</div>;
if (!token || isLoading) return <div className="loading-state">Loading...</div>;

return (
<iframe
src={`https://dashboard.cekura.ai/embed/${agentId}/result/${resultId}?token=${token}&theme=${theme}`}
className="w-full h-[950px] border-0"
allowFullScreen
loading="lazy"
title="Cekura Embed"
/>
);
};

export default VoceraEmbed;

​
Event Handling

Each framework implementation above includes handlers for these core events: 
// Token expired event
if (event.data === 'token_expired') {
  await refreshToken(); // See /embed/refreshing-expired-token for implementation
}
For token management implementation details, refer to: