当前位置：首页 > JavaScript

js实现siri

2026-04-05 12:05:46JavaScript

实现基础语音识别

使用Web Speech API中的SpeechRecognition接口可以捕获用户的语音输入。以下是一个简单的实现示例：

const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
recognition.lang = 'zh-CN'; // 设置语言为中文
recognition.interimResults = false; // 是否返回临时结果

recognition.onresult = (event) => {
  const transcript = event.results[0][0].transcript;
  console.log('识别结果:', transcript);
  processCommand(transcript); // 处理语音指令
};

recognition.start();

语音合成响应

使用SpeechSynthesis接口可以让浏览器朗读文本内容：

function speak(text) {
  const utterance = new SpeechSynthesisUtterance(text);
  utterance.lang = 'zh-CN'; // 设置语言
  utterance.rate = 1; // 语速
  window.speechSynthesis.speak(utterance);
}

指令处理逻辑

构建一个简单的命令匹配系统处理语音指令：

const commands = {
  '时间': () => {
    const now = new Date();
    speak(`现在是${now.getHours()}点${now.getMinutes()}分`);
  },
  '搜索': (query) => {
    window.open(`https://www.baidu.com/s?wd=${encodeURIComponent(query)}`);
    speak('正在为您搜索');
  }
};

function processCommand(text) {
  for (const [keyword, action] of Object.entries(commands)) {
    if (text.includes(keyword)) {
      const param = text.replace(keyword, '').trim();
      action(param);
      return;
    }
  }
  speak('抱歉，我不明白这个指令');
}

唤醒词检测

实现类似"Siri"的唤醒词检测功能：

let isListening = false;

recognition.onstart = () => {
  isListening = true;
};

recognition.onend = () => {
  if (isListening) {
    recognition.start(); // 自动重启监听
  }
};

function checkWakeWord(text) {
  if (text.toLowerCase().includes('siri')) {
    speak('我在听，请说');
    return true;
  }
  return false;
}

完整集成示例

将上述组件整合为一个完整的语音助手：

js实现siri

class VoiceAssistant {
  constructor() {
    this.recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
    this.setupRecognition();
    this.commands = {
      '时间': this.handleTime,
      '搜索': this.handleSearch
    };
  }

  setupRecognition() {
    this.recognition.lang = 'zh-CN';
    this.recognition.interimResults = false;
    this.recognition.continuous = true;

    this.recognition.onresult = (event) => {
      const transcript = event.results[0][0].transcript;
      if (this.checkWakeWord(transcript)) return;
      this.processCommand(transcript);
    };
  }

  speak(text) {
    const utterance = new SpeechSynthesisUtterance(text);
    utterance.lang = 'zh-CN';
    window.speechSynthesis.speak(utterance);
  }

  start() {
    this.recognition.start();
  }

  // 其他方法实现...
}