Quick Start
Get up and running with the Talker Web SDK in minutes.
Overview
The Talker SDK provides two main classes for building PTT applications:
TalkerAdmin- For backend/server-side operations (uses SDK key)TalkerClient- For frontend/client-side operations (uses user auth token)
Important
Never expose your SDK key in client-side code. Use TalkerAdmin only on your backend server.
Backend Setup
First, set up your backend to create users and provide credentials to your frontend.
Node.js / Next.js API Route
import { TalkerAdmin } from '@talker-network/talker-sdk';
// Initialize with your SDK key (keep secret on server!)
const admin = new TalkerAdmin({
sdkKey: process.env.TALKER_SDK_KEY!,
});
// Create a new user
const user = await admin.createUser({ name: 'John Doe' });
// Or get an existing user
const existingUser = await admin.setUser({ userId: 'existing-user-id' });
// Return credentials to frontend
return {
userAuthToken: user.userAuthToken,
userId: user.userId,
a_username: user.aUsername,
a_password: user.aPassword,
};
Frontend Setup
Use the credentials from your backend to initialize the client.
Browser / React
import { TalkerClient } from '@talker-network/talker-sdk';
// Get credentials from your backend
const { userAuthToken, userId, a_username, a_password } =
await fetch('/api/auth').then(r => r.json());
// Initialize client - connection starts automatically
const talker = new TalkerClient({
userAuthToken,
userId,
a_username,
a_password,
});
// Monitor connection status
talker.on('connection_change', ({ connected, status }) => {
console.log(`Connection: ${status}`);
// status: 'connected' | 'connecting' | 'disconnected'
});
// Listen to broadcast events
talker.on('broadcast_start', (data) => {
console.log(`${data.senderName} started speaking`);
});
talker.on('broadcast_end', (data) => {
console.log(`User ${data.senderId} stopped speaking`);
});
Push-to-Talk Implementation
Implement PTT with simple event handlers.
JavaScript
// PTT button handlers
const pttButton = document.getElementById('ptt-button');
pttButton.onmousedown = async () => {
const result = await talker.startTalking(channelId);
if (!result.success) {
switch (result.code) {
case 'not_connected':
// Show "Connecting..." UI
break;
case 'error':
alert(result.message);
break;
}
}
};
pttButton.onmouseup = () => talker.stopTalking();
PTT Result Codes
The startTalking() method returns a result object with the following codes:
| Code | Success | Description |
|---|---|---|
success |
true | PTT started successfully |
already_talking |
true | Already in a PTT session (no action needed) |
not_connected |
false | Not connected, auto-reconnecting in background |
no_user_id |
false | User ID not set |
error |
false | Other error (check message) |
Connection States
The SDK manages connections automatically. Monitor the status to update your UI:
| Status | Meaning |
|---|---|
connected |
Socket and WebRTC data channel both connected, ready for PTT |
connecting |
Connection is being established |
disconnected |
Not connected (will auto-reconnect) |
Auto-reconnect
The SDK automatically reconnects if the connection is lost. If startTalking() is called while disconnected, reconnection is triggered automatically.
Next Steps
- Installation - Detailed installation instructions
- TalkerAdmin API - Backend API reference
- TalkerClient API - Frontend API reference
- React Integration - React hooks and patterns