week11 智能语音输入

面对一个智能助手，我认为语音识别可能是一大重点。比如siri和小爱同学，都具有语音识别以及回应的功能，于是我也在想如何将语音助手的功能也加到我们的AI助手里面。

const recognition = window.SpeechRecognition || window.webkitSpeechRecognition
  ? new (window.SpeechRecognition || window.webkitSpeechRecognition)()
  : null

写于前端的代码：

vue\src\views\LessonPlanGenerator.vue:365

利用window.webkitSpeechRecognition与window.SpeechRecognition来初始化语音识别对象

 const recognition = window.SpeechRecognition || window.webkitSpeechRecognition ? new (window.SpeechRecognition || window.webkitSpeechRecognition)() : null

开始语音输入：通过 startVoiceInput 方法（391行）启动语音识别，用户可以通过语音输入教案需求。

const startVoiceInput = () => {
  if (!recognition) {
    ElMessage.error('当前浏览器不支持语音识别')
    return
  }
  showVoiceDialog.value = true
  isListening.value = true
  isEditing.value = false
  recognition.lang = 'zh-CN'
  recognition.interimResults = true
  recognition.maxAlternatives = 1
  recognition.continuous = true
  recognition.start()
  ElMessage.info('请开始说出教案需求...')
}

停止语音输入：通过 stopVoiceInput 方法（413行）停止语音识别，保存当前文本。

const stopVoiceInput = () => {
  if (recognition) {
    recognition.stop()
  }
  isListening.value = false
  previousText.value = voiceText.value
}

清空语音输入：通过 clearVoiceInput 方法（422行）清空语音输入内容。

const clearVoiceInput = () => {
  voiceText.value = ''
  finalTranscript = ''
  isEditing.value = false
  if (recognition) {
    recognition.stop()
  }
  isListening.value = false
  showVoiceDialog.value = false
}

语音输入生成教案

在语音输入完成后，我们调用generateFromVoice方法，将语音内容作为教案主题，自动填充其他字段，并生成教案：

const generateFromVoice = async () => {
  if (!voiceText.value) {
    ElMessage.warning('请先输入语音内容')
    return
  }
  try {
    isGenerating.value = true
    startTimer()
    const data = {
      topic: voiceText.value.trim(),
      subject: '根据topic值',
      grade: '根据topic值',
      duration: '根据topic值',
      objectives: ['根据topic值'],
      keyPoints: '根据topic值',
      materials: '根据topic值',
      methods: ['根据topic值'],
      steps: ['根据topic值'],
      homework: '根据topic值',
      reflection: '根据topic值',
      educationMode: '根据topic值',
      isVoiceInput: true
    }
    const result = await generateLessonPlanService(data)
    const filename = result.filename || (result.data && result.data.filename)
    const success = result.code === 0 || result.status === 'success'
    if (success && filename) {
      ElMessage.success('教案生成成功！正在下载...')
      await downloadLessonPlan(filename)
    } else {
      ElMessage.error(result.message || '教案生成失败')
    }
  } catch (error) {
    ElMessage.error('教案生成失败：' + (error.message || '网络错误'))
  } finally {
    isGenerating.value = false
    stopTimer()
  }
}