您的位置：首页 > Web前端 > AngularJS

AngularJS进阶(十八)在AngularJS应用中集成科大讯飞语音输入功能

2017-02-07 00:04 459 查看

在AngularJS应用中集成科大讯飞语音输入功能

注：请点击此处进行充电!

前言

根据项目需求，需要在首页搜索框中添加语音输入功能，考虑到科大讯飞语音业务的强大能力，遂决定使用科大讯飞语音输入第三方服务。软件首页截图如下所示：

涉及的源代码如下所示:

[javascript]
view plain
copy
print?

<button ng-click="startRecognize()">
<i class="icon ion-mic-a " ></i>
</button>

    //语音识别
$rootScope.startRecognize = function() {
var speech;
var options = {}; //语音识别参数，用于控制语音引擎的各种技术参数
options.engine = 'iFly';
options.userInterface = 'false';
text = "";
plus.speech.startRecognize(options, function(s) {
text += s;
console.log(text);
text = text.replace(',', '').replace('。', '').replace('?', '');
$scope.$apply(function() {
$rootScope.medname= text;
$scope.searchMed(2, $rootScope.medname)
});
}, function(e) {
$ionicLoading.show({
template: "语音输入失败,请重新尝试"
});
setTimeout(function() {
$ionicLoading.hide();
}, 2000);
});
setTimeout(function() {
plus.speech.stopRecognize();
}, 10000); //超时语音结束
}

其中涉及到使用ionic框架中的按钮组件。

其云端打包授权功能需要到第三方开发平台申请应用后获取相关配置参数。集成过程与微信授权认证差不多。