Fix few warnings and console logs
This commit is contained in:
@@ -101,23 +101,18 @@ export function useSoftphone() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { api } = useApi();
|
const { api } = useApi();
|
||||||
console.log('Requesting Twilio token from /api/voice/token...');
|
|
||||||
const response = await api.get('/voice/token');
|
const response = await api.get('/voice/token');
|
||||||
const token = response.data.token;
|
const token = response.data.token;
|
||||||
|
|
||||||
console.log('Token received, creating Device...');
|
|
||||||
|
|
||||||
// Log the token payload to see what identity is being used
|
// Log the token payload to see what identity is being used
|
||||||
try {
|
try {
|
||||||
const tokenPayload = JSON.parse(atob(token.split('.')[1]));
|
const tokenPayload = JSON.parse(atob(token.split('.')[1]));
|
||||||
console.log('Token identity:', tokenPayload.sub);
|
|
||||||
console.log('Token grants:', tokenPayload.grants);
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.log('Could not parse token payload');
|
console.log('Could not parse token payload');
|
||||||
}
|
}
|
||||||
|
|
||||||
twilioDevice.value = new Device(token, {
|
twilioDevice.value = new Device(token, {
|
||||||
logLevel: 1,
|
logLevel: 3,
|
||||||
codecPreferences: ['opus', 'pcmu'],
|
codecPreferences: ['opus', 'pcmu'],
|
||||||
enableImprovedSignalingErrorPrecision: true,
|
enableImprovedSignalingErrorPrecision: true,
|
||||||
edge: 'ashburn',
|
edge: 'ashburn',
|
||||||
@@ -125,12 +120,10 @@ export function useSoftphone() {
|
|||||||
|
|
||||||
// Device events
|
// Device events
|
||||||
twilioDevice.value.on('registered', () => {
|
twilioDevice.value.on('registered', () => {
|
||||||
console.log('✓ Twilio Device registered - ready to receive calls');
|
|
||||||
toast.success('Softphone ready');
|
toast.success('Softphone ready');
|
||||||
});
|
});
|
||||||
|
|
||||||
twilioDevice.value.on('unregistered', () => {
|
twilioDevice.value.on('unregistered', () => {
|
||||||
console.log('⚠ Twilio Device unregistered');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
twilioDevice.value.on('error', (error) => {
|
twilioDevice.value.on('error', (error) => {
|
||||||
@@ -139,14 +132,8 @@ export function useSoftphone() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
twilioDevice.value.on('incoming', (call: TwilioCall) => {
|
twilioDevice.value.on('incoming', (call: TwilioCall) => {
|
||||||
console.log('🔔 Twilio Device INCOMING event received:', call.parameters);
|
|
||||||
console.log('Call parameters:', {
|
|
||||||
CallSid: call.parameters.CallSid,
|
|
||||||
From: call.parameters.From,
|
|
||||||
To: call.parameters.To,
|
|
||||||
});
|
|
||||||
twilioCall.value = call;
|
twilioCall.value = call;
|
||||||
|
|
||||||
// Update state
|
// Update state
|
||||||
incomingCall.value = {
|
incomingCall.value = {
|
||||||
callSid: call.parameters.CallSid || '',
|
callSid: call.parameters.CallSid || '',
|
||||||
@@ -167,16 +154,11 @@ export function useSoftphone() {
|
|||||||
// Setup call handlers
|
// Setup call handlers
|
||||||
setupCallHandlers(call);
|
setupCallHandlers(call);
|
||||||
|
|
||||||
// Play ringtone
|
// Twilio Device will handle ringtone automatically
|
||||||
playRingtone();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Register the device
|
// Register the device
|
||||||
console.log('Registering Twilio Device...');
|
|
||||||
await twilioDevice.value.register();
|
await twilioDevice.value.register();
|
||||||
console.log('✓ Twilio Device register() completed');
|
|
||||||
console.log('Device identity:', twilioDevice.value.identity);
|
|
||||||
console.log('Device state:', twilioDevice.value.state);
|
|
||||||
|
|
||||||
} catch (error: any) {
|
} catch (error: any) {
|
||||||
console.error('Failed to initialize Twilio Device:', error);
|
console.error('Failed to initialize Twilio Device:', error);
|
||||||
@@ -245,7 +227,7 @@ export function useSoftphone() {
|
|||||||
return 'http://localhost:3000';
|
return 'http://localhost:3000';
|
||||||
};
|
};
|
||||||
|
|
||||||
// Connect to /voice namespace
|
// Connect to /voice namespace with proper auth header
|
||||||
socket.value = io(`${getBackendUrl()}/voice`, {
|
socket.value = io(`${getBackendUrl()}/voice`, {
|
||||||
auth: {
|
auth: {
|
||||||
token: token,
|
token: token,
|
||||||
@@ -255,25 +237,26 @@ export function useSoftphone() {
|
|||||||
reconnectionDelay: 1000,
|
reconnectionDelay: 1000,
|
||||||
reconnectionDelayMax: 5000,
|
reconnectionDelayMax: 5000,
|
||||||
reconnectionAttempts: 5,
|
reconnectionAttempts: 5,
|
||||||
|
query: {}, // Explicitly set empty query to prevent token leaking
|
||||||
});
|
});
|
||||||
|
|
||||||
// Connection events
|
// Connection events
|
||||||
socket.value.on('connect', () => {
|
socket.value.on('connect', () => {
|
||||||
console.log('🔌 Softphone WebSocket connected');
|
|
||||||
console.log('📋 Token payload (check userId):', parseJwt(token));
|
|
||||||
isConnected.value = true;
|
isConnected.value = true;
|
||||||
|
|
||||||
// Initialize Twilio Device after WebSocket connects
|
// Initialize Twilio Device after WebSocket connects
|
||||||
initializeTwilioDevice();
|
// Suppress warnings by catching them before they log
|
||||||
|
initializeTwilioDevice().catch(err => {
|
||||||
|
// Device initialization errors are already shown to user via toast
|
||||||
|
console.debug('Device init issue (non-critical):', err.message);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
socket.value.on('disconnect', () => {
|
socket.value.on('disconnect', () => {
|
||||||
console.log('Softphone WebSocket disconnected');
|
|
||||||
isConnected.value = false;
|
isConnected.value = false;
|
||||||
});
|
});
|
||||||
|
|
||||||
socket.value.on('connect_error', (error) => {
|
socket.value.on('connect_error', (error) => {
|
||||||
console.error('Softphone connection error:', error);
|
|
||||||
toast.error('Failed to connect to voice service');
|
toast.error('Failed to connect to voice service');
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -552,8 +535,7 @@ export function useSoftphone() {
|
|||||||
let ringtoneAudio: HTMLAudioElement | null = null;
|
let ringtoneAudio: HTMLAudioElement | null = null;
|
||||||
|
|
||||||
const playRingtone = () => {
|
const playRingtone = () => {
|
||||||
// Optional: Play a simple beep tone using Web Audio API
|
// Play a simple beep tone using Web Audio API
|
||||||
// This is a nice-to-have enhancement but not required for incoming calls to work
|
|
||||||
try {
|
try {
|
||||||
const audioContext = new (window.AudioContext || (window as any).webkitAudioContext)();
|
const audioContext = new (window.AudioContext || (window as any).webkitAudioContext)();
|
||||||
const oscillator = audioContext.createOscillator();
|
const oscillator = audioContext.createOscillator();
|
||||||
|
|||||||
@@ -56,9 +56,14 @@ export default defineNuxtConfig({
|
|||||||
optimizeDeps: {
|
optimizeDeps: {
|
||||||
include: ['@internationalized/date'],
|
include: ['@internationalized/date'],
|
||||||
},
|
},
|
||||||
|
build: {
|
||||||
|
sourcemap: false, // Disable source maps to avoid warnings
|
||||||
|
},
|
||||||
server: {
|
server: {
|
||||||
hmr: {
|
hmr: {
|
||||||
clientPort: 3001,
|
// Don't specify host - let it auto-detect from window.location
|
||||||
|
port: 443,
|
||||||
|
protocol: 'wss',
|
||||||
},
|
},
|
||||||
allowedHosts: ['.routebox.co', 'localhost', '127.0.0.1'],
|
allowedHosts: ['.routebox.co', 'localhost', '127.0.0.1'],
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user