基于uniapp开发App实现百度语音识别（Vue2版）

一、引言：为何选择uniapp与百度语音识别？

在移动应用开发中，uniapp凭借其“一次编写，多端运行”的特性，成为跨平台开发的热门选择。而百度语音识别作为国内领先的语音技术服务商，提供高准确率、低延迟的语音转文字服务，支持实时流式识别与离线命令词识别，满足多种场景需求。结合uniapp（Vue2）与百度语音识别，开发者可快速构建具备语音交互能力的App，覆盖iOS、Android及小程序等多端。

二、技术准备：环境与工具配置

1. 百度语音识别API开通

• 注册百度智能云账号：访问百度智能云官网，完成实名认证。
• 创建语音识别应用：在“人工智能 > 语音技术 > 语音识别”中新建应用，获取API Key与Secret Key。
• 选择服务类型：根据需求选择“实时语音识别”或“录音文件识别”，并配置识别语言（如中文、英文）及领域模型（如通用、金融）。

2. uniapp项目初始化

• 使用HBuilderX创建uniapp项目，选择Vue2模板。
• 确保项目支持原生插件调用（如录音权限），在manifest.json中配置：

  "app-plus": {
    "permissions": ["record", "microphone"]
  }

3. 依赖安装与工具准备

• 安装axios用于HTTP请求：

  npm install axios --save

• 准备录音工具：uniapp通过plus.audio.getRecorder实现录音，需在真机调试时确保麦克风权限已开启。

三、核心实现：从录音到语音识别

1. 录音功能实现

通过uniapp的录音API捕获音频流，关键代码如下：

// 录音配置
const recorderOptions = {
  filename: '_doc/audio/', // 录音文件保存路径
  format: 'amr', // 格式：amr/wav
  samplerate: 16000 // 采样率（百度要求16k或8k）
};
// 开始录音
function startRecord() {
  return new Promise((resolve, reject) => {
    const recorder = plus.audio.getRecorder();
    recorder.record(recorderOptions, 
      (path) => resolve(path), 
      (error) => reject(error)
    );
  });
}
// 停止录音
function stopRecord() {
  plus.audio.getRecorder().stop();
}

2. 获取百度语音识别Token

百度API需通过Token验证，需在服务端生成（避免前端暴露Secret Key），或使用临时Token方案。前端通过axios调用服务端接口获取Token：

async function getBaiduToken() {
  try {
    const response = await axios.get('https://your-server.com/api/baidu-token', {
      params: { apiKey: 'YOUR_API_KEY' }
    });
    return response.data.token;
  } catch (error) {
    console.error('获取Token失败:', error);
  }
}

3. 语音数据上传与识别

将录音文件上传至百度服务器并获取识别结果，分为两步：

步骤1：上传音频文件

async function uploadAudio(filePath) {
  const formData = new FormData();
  formData.append('audio', {
    uri: filePath,
    type: 'audio/amr',
    name: 'audio.amr'
  });
  const response = await axios.post('https://vop.baidu.com/server_api', formData, {
    headers: {
      'Content-Type': 'multipart/form-data'
    },
    params: {
      cuid: 'YOUR_DEVICE_ID', // 设备唯一标识
      token: await getBaiduToken(),
      format: 'amr',
      rate: 16000,
      channel: 1,
      len: fs.statSync(filePath).size, // 文件大小（字节）
      speech_id: Date.now() // 请求唯一标识
    }
  });
  return response.data;
}

步骤2：处理识别结果

百度返回JSON格式结果，需解析result字段：

{
  "corpus_no": "123456",
  "err_no": 0, // 0表示成功
  "err_msg": "success",
  "sn": "123456789",
  "result": ["这是一段测试语音"] // 识别文本数组
}

完整识别逻辑：

async function recognizeSpeech() {
  try {
    const filePath = await startRecord(); // 开始录音
    setTimeout(() => stopRecord(), 5000); // 5秒后停止（示例）
    const result = await uploadAudio(filePath);
    if (result.err_no === 0) {
      console.log('识别结果:', result.result.join(''));
    } else {
      console.error('识别失败:', result.err_msg);
    }
  } catch (error) {
    console.error('语音识别异常:', error);
  }
}

四、优化与注意事项

1. 性能优化

• 录音格式选择：优先使用amr格式（体积小），若需高音质可选wav。
• 分片上传：对于长语音，使用百度流式识别API，分片发送音频数据。
• 错误重试机制：网络波动时自动重试3次。

2. 常见问题解决

• 权限拒绝：在manifest.json中明确声明麦克风权限，并在App首次启动时引导用户授权。
• Token过期：设置Token缓存（如本地存储），过期前10分钟自动刷新。
• 跨域问题：若通过前端直接调用百度API，需配置代理或使用服务端中转。

3. 安全建议

• 避免在前端代码中硬编码Secret Key，所有敏感操作通过服务端完成。
• 对用户上传的音频进行格式校验，防止恶意文件注入。

五、扩展应用场景

1. 语音搜索：在电商App中实现语音输入商品名称。
2. 语音笔记：记录会议或课堂内容，自动转为文字。
3. IoT控制：通过语音指令控制智能家居设备。

六、总结与展望

通过uniapp（Vue2）集成百度语音识别，开发者可低成本实现跨平台语音交互功能。未来可结合NLP技术（如百度UNIT）进一步优化语义理解，或探索方言识别、情感分析等高级功能。建议持续关注百度语音识别API的更新，及时适配新特性（如实时字幕、多语种混合识别）。

附：完整代码示例
GitHub仓库链接（示例代码包含录音、Token获取、API调用全流程）

通过本文的指导，开发者能够系统掌握uniapp与百度语音识别的集成方法，快速构建具备语音交互能力的移动应用。