Vue文字转语音实现

在开发流程中,面对语音支持的需求,小规模语音内容或许可以通过预处理后播放来轻松应对,但当涉及大量语音时,这一方法就显得繁琐低效了。为此,智慧的开发者们总能找到便捷的解决方案------利用Web技术实现语音播放,既高效又省力。那么该怎么实现呢,请跟随我的脚步看看吧。

一、安装

借助 speak-tts插件,实现语音播放。

二、使用

  1. 在需要使用的地方引入speak-tts
  2. 初始化speak-tts
  3. 调用speak()方法将文字转语音并输出
javascript 复制代码
// 第一步
import Speech from "speak-tts";

//第二步 我是全局注册的
    speechInit() {
      window.speech = new Speech();
      speech.setLanguage("zh-CN");
      speech.setPitch(1.5);
      speech.init().then(() => {});
    },

// 第三步 播放方法
    playVoice(text) {
      speech
        .speak({
          text: text,
          listeners: {
            //开始播放
            onstart: () => {
              console.log("播放开始");
            },
            //判断播放是否完毕
            onend: () => {
              console.log("播放结束");
            },
            //恢复播放
            onresume: () => {},
          },
        })
        .then(() => {
          // console.log("读取成功");
        });
    },

三、注意事项

  • 如果需要取消播放,可调用 speech.cancel()
  • setLanguage()可设置语言类型,输入文本需与之对应【中文 有 zh-CN、zh-TW、zh-HK ,自行按需设置】
  • 想过更改音色,但没成功,望成功的伙伴们告知一声。
相关推荐
东方佑1 天前
从音频到Token:构建原神角色语音识别模型的完整实践
人工智能·音视频·语音识别
一条数据库2 天前
南京方言数据集|300小时高质量自然对话音频|专业录音棚采集|方言语音识别模型训练|情感计算研究|方言保护文化遗产数字化|语音情感识别|方言对话系统开发
人工智能·音视频·语音识别
殷忆枫2 天前
基于STM32的智能语音识别饮水机系统设计
stm32·嵌入式硬件·语音识别
SmartJavaAI4 天前
Java调用Whisper和Vosk语音识别(ASR)模型,实现高效实时语音识别(附源码)
java·人工智能·whisper·语音识别
MYZR15 天前
现代农业自动化的技术演进与应用
自动化·语音识别
bst@微胖子6 天前
WGAI项目图像视频语音识别功能
人工智能·语音识别·xcode
东风西巷7 天前
Balabolka:免费高效的文字转语音软件
前端·人工智能·学习·语音识别·软件需求
大数据张老师8 天前
【案例】AI语音识别系统的标注分区策略
人工智能·系统架构·语音识别·架构设计·后端架构
小马哥编程8 天前
计算机网络:调制解调器
人工智能·计算机网络·语音识别
今日待办8 天前
Arduino Nano33 BLESense Rev2【室内空气质量检测语音识别蓝牙调光台灯】
c语言·单片机·嵌入式硬件·mcu·语音识别·ardunio·arduinonano33