脚本之家

电脑版
提示:原网页已由神马搜索转码, 内容由www.jb51.net提供.
您的位置：首页→ 软件编程→ 其它相关→ uniapp语音识别（讯飞语音）转文字

uniapp语音识别（讯飞语音）转文字

  更新时间：2022年12月24日 15:02:33  作者：Nanchen_42 
这篇文章主要介绍了uniapp语音识别（讯飞语音）转文字,需要的朋友可以参考下

常见应用：游戏界面 文字语音、商城导航栏的语音输入搜索框、聊天界面的语音文字输入等.

引自官方 unicloud官方语音：

语音输入接口可使得网页开发人员能快速调用设备的麦克风进行语音输入，而不需要安装额外的浏览器插件。规范不定义底层语音识别引擎的技术架构，浏览器实现可基于语音识别服务器或本地内置语音识别模块。

配置SDK–识别讯飞语音（如果用不了讯飞语音，可换百度语音，自己去看接入文档）

进入项目根目录下的 manifest.json -> App模块配置->speech 勾选 讯飞语音识别，如下图所示：

在这里插入图片描述

index.vue文件写入

<template>
 <view class="content">
  <image class="logo" src="/static/logo.png"></image>
  <button @click="voiceBegain">讯飞语音识别</button>
  <view v-if="words1">
   这是searchValue：{{words1}}
  </view>
  <view v-if="words2">
   这是searchText：{{words2}}
  </view>
 </view>
</template>
<script>
 export default {
  data() {
   return {
    title: 'Hello',
    words1: '',
    words2: ''
   }
  },
  onLoad() {
  },
  methods: {
   send() {
    uniCloud.callFunction({
     name: 'sendcode',
     success: (e) => {
      console.log('这是发送验证码', e);
     }
    })
   },
   // 调用讯飞语音识别
   voiceBegain() {
    let _this = this;
    let options = {};
    //#ifdef APP-PLUS || APP-PLUS-NVUE
    options.engine = 'iFly';
    options.punctuation = false; // 是否需要标点符号 
    options.timeout = 10 * 1000; //语音录入持续时长
    plus.speech.startRecognize(options, function(s) {
     _this.searchText = _this.searchText + s;
     console.log(_this.searchText) //拿到语音识别的结果
     //下面是逻辑  
     _this.searchValue = s;
     _this.searchText = ""

     // 打印输出结果
      _this.words1 = _this.searchValue
      _this.words2 = _this.searchText

     // 关闭语音
     plus.speech.stopRecognize();
    });
    //#endif
    // #ifdef H5
    alert("只有h5平台才有alert方法")
    // #endif
   }
  }
 }
</script>
<style>
 .content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
 }
 .logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
 }
 .text-area {
  display: flex;
  justify-content: center;
 }
 .title {
  font-size: 36rpx;
  color: #8f8f94;
 }
</style>

如图：

在这里插入图片描述

运行云打包或自定义调试基座生成 apk 文件，apk安装到手机上;

点击button按钮，触发自定义回调函数

在这里插入图片描述

此时页面输出

在这里插入图片描述

注意：

普通浏览器里没有 plus 环境，只有 HBuilder 真机运行和打包后才能运行plus api。否则报错：

在这里插入图片描述

以上就是uniapp语音识别（讯飞语音）转文字的详细内容，更多关于uniapp语音识别（讯飞语音）转文字的资料请关注脚本之家其它相关文章！

相关文章

    • 300行代码让外婆实现语音搜索购物功能
      这篇文章主要介绍了300行代码让外婆实现语音搜索购物功能,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
      2021-03-03
    • 详解静态分析技术符号执行
      本文提纲絜领的介绍了符号执行，让大家明白这个技术的主要作用和面临的挑战，领大家入坑。
      2021-05-05
    • 内存溢出和内存泄漏的详解及区别
      这篇文章主要介绍了内存溢出和内存泄漏的详解及区别的相关资料,需要的朋友可以参考下
      2017-03-03
    • 浅谈如何降低软件复杂性
      软件的复杂性是我们程序员在日常开发中所必须面对的东西，学会如何 “弄清楚什么是软件复杂性，找到导致软件复杂的原因，并利用各种手法去战胜软件的复杂性” 是一门必备的能力。
      2021-05-05
    • Hbuilder连远程接服务器上传代码的图文教程
      下面小编就为大家分享一篇Hbuilder连远程接服务器上传代码的图文教程，具有很好的参考价值，一起跟随小编过来看看吧，希望对大家有所帮助
      2017-11-11
    • HBuilder打包App方法(图文教程)
      下面小编就为大家带来一篇HBuilder打包App方法(图文教程)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
      2017-09-09
    • 初步了解代理和负载均衡
      本文主要初步带你了解代理和负载均衡的知识，文中对正向、反向代理以及反向代理与负载均衡的关系等做了详细讲解，感兴趣的朋友可以参考一下这篇文章
      2021-09-09
    • Windows API函数大全(完整)
      Windows API函数大全，从事软件开发的朋友可以参考下
      2012-05-05
    • 计算机网络编程MQTT协议基础原理详解
      这篇文章主要为大家介绍了计算机编程MQTT协议的基础原理详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步早日升职加薪
      2021-11-11
    • app开发之原生开发、H5开发和混合开发的区别
      这篇文章主要介绍了app开发之原生开发、H5开发和混合开发的区别,需要的朋友可以参考下
      2019-12-12

    最新评论