feat: add realtime practice voice selector

This commit is contained in:
2026-07-22 12:24:46 +08:00
parent 87772cc64c
commit 455267cf6f
3 changed files with 229 additions and 24 deletions
+93 -22
View File
@@ -2,6 +2,93 @@ import { apiRequest } from './api';
type RealtimeStatus = 'idle' | 'connecting' | 'connected' | 'listening' | 'speaking';
export const REALTIME_PRACTICE_VOICE_OPTIONS = [
{ value: 'Tina', label: '普通话 · 温暖女声 · Tina' },
{ value: 'Cindy', label: '台式口音 · 甜美女声 · Cindy' },
{ value: 'Liora Mira', label: '普通话 · 治愈女声 · Liora Mira' },
{ value: 'Sunnybobi', label: '普通话 · 邻家女声 · Sunnybobi' },
{ value: 'Raymond', label: '普通话 · 清亮男声 · Raymond' },
{ value: 'Ethan', label: '普通话 · 温暖男声 · Ethan' },
{ value: 'Theo Calm', label: '普通话 · 沉静男声 · Theo Calm' },
{ value: 'Serena', label: '普通话 · 温柔女声 · Serena' },
{ value: 'Harvey', label: '普通话 · 醇厚男声 · Harvey' },
{ value: 'Maia', label: '普通话 · 知性女声 · Maia' },
{ value: 'Evan', label: '普通话 · 青年男声 · Evan' },
{ value: 'Qiao', label: '台式口音 · 甜美女声 · Qiao' },
{ value: 'Momo', label: '普通话 · 俏皮女声 · Momo' },
{ value: 'Wil', label: '港风口音 · 青年男声 · Wil' },
{ value: 'Angel', label: '普通话 · 甜美女声 · Angel' },
{ value: 'Li Cassian', label: '普通话 · 克制男声 · Li Cassian' },
{ value: 'Mia', label: '普通话 · 舒缓女声 · Mia' },
{ value: 'Joyner', label: '普通话 · 幽默男声 · Joyner' },
{ value: 'Gold', label: '普通话 · 说唱男声 · Gold' },
{ value: 'Katerina', label: '普通话 · 成熟韵律女声 · Katerina' },
{ value: 'Ryan', label: '普通话 · 张力男声 · Ryan' },
{ value: 'Jennifer', label: '英语质感 · 电影感女声 · Jennifer' },
{ value: 'Aiden', label: '英语质感 · 青年男声 · Aiden' },
{ value: 'Mione', label: '英语质感 · 成熟女声 · Mione' },
{ value: 'Sunny', label: '四川话 · 甜美女声 · Sunny' },
{ value: 'Dylan', label: '北京话 · 青年男声 · Dylan' },
{ value: 'Eric', label: '四川话 · 成都男声 · Eric' },
{ value: 'Peter', label: '天津话 · 相声男声 · Peter' },
{ value: 'Joseph Chen', label: '闽南话 · 怀旧男声 · Joseph Chen' },
{ value: 'Marcus', label: '陕西话 · 厚重男声 · Marcus' },
{ value: 'Li', label: '南京话 · 叔叔男声 · Li' },
{ value: 'Kiki', label: '粤语 · 亲和女声 · Kiki' },
{ value: 'Rocky', label: '粤语 · 幽默男声 · Rocky' },
{ value: 'Sohee', label: '韩系 · 活力女声 · Sohee' },
{ value: 'Lenn', label: '德系 · 青年男声 · Lenn' },
{ value: 'Ono Anna', label: '日系 · 俏皮女声 · Ono Anna' },
{ value: 'Sonrisa', label: '拉美 · 热情女声 · Sonrisa' },
{ value: 'Bodega', label: '西语 · 热情男声 · Bodega' },
{ value: 'Emilien', label: '法式 · 浪漫男声 · Emilien' },
{ value: 'Andre', label: '普通话 · 稳重男声 · Andre' },
{ value: 'Radio Gol', label: '解说 · 足球评论男声 · Radio Gol' },
{ value: 'Alek', label: '俄式 · 温暖男声 · Alek' },
{ value: 'Rizky', label: '印尼 · 青年男声 · Rizky' },
{ value: 'Roya', label: '普通话 · 活力女声 · Roya' },
{ value: 'Arda', label: '普通话 · 清亮温暖声 · Arda' },
{ value: 'Hana', label: '越南 · 成熟女声 · Hana' },
{ value: 'Dolce', label: '意式 · 慵懒男声 · Dolce' },
{ value: 'Jakub', label: '波兰 · 艺术男声 · Jakub' },
{ value: 'Griet', label: '荷兰 · 艺术女声 · Griet' },
{ value: 'Eliška', label: '捷克 · 温暖女声 · Eliška' },
{ value: 'Marina', label: '都市 · 多元女声 · Marina' },
{ value: 'Siiri', label: '北欧 · 安静女声 · Siiri' },
{ value: 'Ingrid', label: '挪威 · 乡村女声 · Ingrid' },
{ value: 'Sigga', label: '冰岛 · 知性女声 · Sigga' },
{ value: 'Bea', label: '菲律宾 · 甜美女声 · Bea' },
{ value: 'Chloe', label: '马来 · 职场女声 · Chloe' }
] as const;
export type RealtimePracticeVoice = typeof REALTIME_PRACTICE_VOICE_OPTIONS[number]['value'];
export const REALTIME_PRACTICE_VOICES = REALTIME_PRACTICE_VOICE_OPTIONS.map((item) => item.value);
export const DEFAULT_REALTIME_PRACTICE_VOICE: RealtimePracticeVoice = 'Ethan';
export const isRealtimePracticeVoice = (value: unknown): value is RealtimePracticeVoice =>
typeof value === 'string' && REALTIME_PRACTICE_VOICE_OPTIONS.some((item) => item.value === value);
export const normalizeRealtimePracticeVoice = (value: unknown): RealtimePracticeVoice =>
isRealtimePracticeVoice(value) ? value : DEFAULT_REALTIME_PRACTICE_VOICE;
export const createRealtimePracticeSessionUpdate = (instructions: string, voice: unknown) => ({
event_id: `event_${Date.now()}`,
type: 'session.update',
session: {
modalities: ['text', 'audio'],
voice: normalizeRealtimePracticeVoice(voice),
input_audio_format: 'pcm',
output_audio_format: 'pcm',
input_audio_transcription: { model: 'qwen3-asr-flash-realtime' },
instructions,
turn_detection: {
type: 'semantic_vad',
threshold: 0.5,
prefix_padding_ms: 500,
silence_duration_ms: 800
}
}
});
interface RealtimeSdpResponse {
answerSdp: string;
model: string;
@@ -29,7 +116,7 @@ export interface RealtimePracticeCallbacks {
}
export interface RealtimePracticeController {
start: (instructions: string) => Promise<void>;
start: (instructions: string, voice?: RealtimePracticeVoice) => Promise<void>;
stop: () => void;
resumeAudio: () => Promise<boolean>;
}
@@ -87,26 +174,9 @@ export const createRealtimePracticeController = (callbacks: RealtimePracticeCall
connection = null;
};
const sendSessionUpdate = (channel: RTCDataChannel, instructions: string) => {
const sendSessionUpdate = (channel: RTCDataChannel, instructions: string, voice: RealtimePracticeVoice) => {
if (channel.readyState !== 'open') return;
channel.send(JSON.stringify({
event_id: `event_${Date.now()}`,
type: 'session.update',
session: {
modalities: ['text', 'audio'],
voice: 'Ethan',
input_audio_format: 'pcm',
output_audio_format: 'pcm',
input_audio_transcription: { model: 'qwen3-asr-flash-realtime' },
instructions,
turn_detection: {
type: 'semantic_vad',
threshold: 0.5,
prefix_padding_ms: 500,
silence_duration_ms: 800
}
}
}));
channel.send(JSON.stringify(createRealtimePracticeSessionUpdate(instructions, voice)));
};
const handleEvent = (raw: string, attempt: number, provider: ProviderEventHandlers) => {
@@ -176,8 +246,9 @@ export const createRealtimePracticeController = (callbacks: RealtimePracticeCall
}
};
const start = async (instructions: string) => {
const start = async (instructions: string, voice: RealtimePracticeVoice = DEFAULT_REALTIME_PRACTICE_VOICE) => {
if (!isSupported()) throw new Error('当前设备不支持实时语音,请使用录音对练');
const selectedVoice = normalizeRealtimePracticeVoice(voice);
stop();
const attempt = ++activeAttempt;
callbacks.onStatus('connecting');
@@ -219,7 +290,7 @@ export const createRealtimePracticeController = (callbacks: RealtimePracticeCall
onSessionCreated: () => {
if (!isCurrent(attempt) || !localChannel || sessionUpdateSent) return;
sessionUpdateSent = true;
sendSessionUpdate(localChannel, instructions);
sendSessionUpdate(localChannel, instructions, selectedVoice);
},
onSessionUpdated: () => {
if (!isCurrent(attempt) || !sessionUpdateSent) return;