【Recorder.js+百度语音识别】全栈方案技术细节
项目中需要利用百度语音接口在Web端实现语音识别功能,采用了这样的技术方案,但实现时遇到了很多问题,发现网上大部分文章都只是在详解官方提供的example示例,对实际开发没有提供什么有价值的建议,而 recorder.js 是无法直接适配百度AI的语音接口的,故本篇将开发中各个细节点记录与此,欢迎指点交流。 一. 技术栈选择 需求 :利用百度语音接口在Web端实现语音识别功能 技术栈 : React + recorder-tool.js + recorder.js + Express + Baidu语音识别API recorder.js 项目地址: https://github.com/mattdiamond/Recorderjs 演示效果 : 二. 前端开发细节 为recorder.js提供一个代理对象 前端的主框架采用 React ,在基本结构和语法上并没有太多问题,为了使用 recorder.js ,我们封装了一个 recorder-tool.js 作为代理,其实现方法较为简单,就是将官方示例中 example 示例中的 html 文件的脚本部分封装成一个单例对象作为 recorder.js 的代理,然后暴露一组 API 供上层调用,大致的结构如下: import Recorder from './recorder-src'; //Singleton var recorder