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语音识别(讯飞语音)转文字的资料请关注脚本之家其它相关文章!

相关文章

  • 浅谈如何降低软件复杂性

    浅谈如何降低软件复杂性

    软件的复杂性是我们程序员在日常开发中所必须面对的东西,学会如何 “弄清楚什么是软件复杂性,找到导致软件复杂的原因,并利用各种手法去战胜软件的复杂性” 是一门必备的能力。
    2021-05-05
  • Hbuilder连远程接服务器上传代码的图文教程

    Hbuilder连远程接服务器上传代码的图文教程

    下面小编就为大家分享一篇Hbuilder连远程接服务器上传代码的图文教程,具有很好的参考价值,一起跟随小编过来看看吧,希望对大家有所帮助
    2017-11-11
  • ascii码表(二进制 十进制 十六进制)详细介绍

    ascii码表(二进制 十进制 十六进制)详细介绍

    这篇文章主要介绍了ascii码表二进制 十进制 十六进制详细介绍的相关资料,需要的朋友可以参考下
    2017-01-01
  • java与c#的区别、两者有什么不同?

    java与c#的区别、两者有什么不同?

    Java和C#都是一门面向对象的语言,Java更多地借鉴了C++的优点,而摒弃了它的一些不太容易被人掌握的知识点(有些不能说是缺点),并且增加了一些自己的特点,而C#则是更多地借鉴了Java的优点,而增加了一些自己的特点
    2013-04-04
  • 10 款珍藏已久的 Chrome 浏览器插件(程序员必装)

    10 款珍藏已久的 Chrome 浏览器插件(程序员必装)

    Chrome 浏览器有一个好处,就是插件极其丰富,只有你想不到的,没有你找不到的,这恐怕是 Chrome 浏览器被众多爱好者钟爱的原因吧。今天给大家分享这些插件太强了,Chrome 必装!尤其程序员
    2021-03-03
  • 内存溢出和内存泄漏的详解及区别

    内存溢出和内存泄漏的详解及区别

    这篇文章主要介绍了内存溢出和内存泄漏的详解及区别的相关资料,需要的朋友可以参考下
    2017-03-03
  • App开发建议技巧

    App开发建议技巧

    有同学问我,对应用开发你有没有值得注意或小技巧的地方可以分享的。比如适配、优化、排查错误什么的。鸡排把自己的总结笔记整理出来了。供大家参考
    2018-01-01
  • 浅谈软件工程师的自我修养

    浅谈软件工程师的自我修养

    在本文中,我们将探讨软件开发过程中关于角色、重构和质量的问题。软件不仅成为了一个必需品,更成为了一个竞争优势。因为众多公司围绕软件而竞争,软件开发相关的事宜显得越发重要。开发软件的人—软件工程师正显得越发重要。
    2021-05-05
  • 浅谈架构模式变迁之从分层架构到微服务架构

    浅谈架构模式变迁之从分层架构到微服务架构

    一般地,架构模式大致可以分成两类,单体架构(monolithic architecture)和分布式架构(distributed architecture)。
    2021-05-05
  • Kotlin与Java的区别详解

    Kotlin与Java的区别详解

    这篇文章介绍了Kotlin与Java的区别,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-12-12

最新评论