文字转语音

SpeechSynthesisUtterance是HTML5中新增的API,用于将指定文字合成为对应的语音

function sayTTS(content) {
const synth = window.speechSynthesis;
const msg = new SpeechSynthesisUtterance()
msg.text = content;//文字内容
msg.lang = "zh-CN";//使用的语言:中文
msg.volume = 1;
//声音音量:0-1
msg.rate = 0.8;
//语速:0-10
msg.pitch = 0.8;
//音高:0-1
synth.speak(msg);
//播放
msg.onend = () => {
console.log("语音播报结束");
}

事件

    //暂停
synth.pause();
//重新开始
synth.resume();
//取消
synth.cancel();
//获取支持的语言数组. 注意:必须添加在voiceschanged事件中才能生效
synth.getVoices
	msg.lang:使用语言
msg.onboundary:语音达到单词或句子边界时触发
msg.onend: 语音说完后触发(这是一个函数)
msg.onerror: 错误时触发
msg.onmark: 语音到达指定的 SSML “标记” 标签时触发
msg.onpause: 暂停
msg.onresume: 恢复暂停
msg.onstart: 开始
msg.pitch: 音高
msg.rate: 语速
msg.text: 文本
msg.voice: 语音
msg.volume: 音量

兼容

ie不支持,目前主流浏览器如Chrome,Edge,Safari等等都是支持的

js文字转语音播放SpeechSynthesisUtterance的更多相关文章

  1. JS实现文字转语音播放

    JS实现文字转语音播放背景实现方式第一种:百度文字转语音开放API第二种:微软TTS语音引擎第三种:SpeechSynthesisUtterance总结背景在做项目的过程中,经常会遇到场景是客户要求播 ...

  2. js文字转语音并播放

    这里调用的是百度文字转语音开放API html: <div> <input type="text" id="ttsText"> < ...

  3. js模仿微信语音播放的小功能

    自己写的一个模仿微信语音播放的小功能,实现的主要功能是:点击播放,点击暂停,播放切换,,,  代码如下: <!DOCTYPE html> <html lang="en&qu ...

  4. js仿微信语音播放

    html结构如下: <div class="app-voice-you" voiceSrc="xx.mp3"> <img class=&quo ...

  5. js文字转语音(speechSynthesis)

    环境: windows 官网网址: https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis 基础使用: var msg = n ...

  6. web端文字转语音的几种方案

    最近在开发一个微信排队取号的的系统,其中对于服务员端(管理端) 需要有呼叫功能,即点按钮 就播出"xxx号顾客请就座"的声音. 经过在网上一番搜索研究,web端实现指定文字的语音播 ...

  7. Delphi文字转语音TTS【支持选择语音库,播放,暂停,开始,停止,生成语音文件,设置音量,设置语速】

    作者QQ:(648437169) 点击下载➨文字转语音TTS [Delphi 文字转语音TTS]调用系统自带的TTS组件,支持XP,vista,win7,win8,win10系统,支持选择语音库,播放 ...

  8. Android文字转语音

    虽然视觉上的反馈通常是给用户提供信息最快的方式,但这要求用户把注意力设备上.当用户不能查看设备时,则需要一些其他通信的方法.Android提供了强大的文字转语音Text-to-Speech,TTS A ...

  9. jQuery语音播放插件

    自己做jQuery插件:将audio5js封装成jQuery语音播放插件   日前的一个项目需要用到语音播放功能.发现Audio5js符合需求且使用简单,又鉴于jQuery控件便于开发操作,于是有了以 ...

  10. Android技术分享-文字转语音并朗读

    Android技术分享-文字转语音并朗读 最近在做一个项目,其中有一个功能是需要将文本转换成语音并播放出来.下面我将我的做法分享一下. 非常令人开心的是,Android系统目前已经集成了TTS,提供了 ...

随机推荐

  1. 探索CPU的黑盒子:解密指令执行的秘密

    引言 在我们之前的章节中,我们着重讲解了CPU内部的处理过程,以及与之密切相关的数据总线知识.在这个基础上,我们今天将继续深入探讨CPU执行指令的相关知识,这对于我们理解计算机的工作原理至关重要. C ...

  2. 20. 从零用Rust编写正反向代理,四层反向代理stream(tcp与udp)实现

    wmproxy wmproxy是由Rust编写,已实现http/https代理,socks5代理, 反向代理,静态文件服务器,内网穿透,配置热更新等, 后续将实现websocket代理等,同时会将实现 ...

  3. java_2.常量、Scanner类、基本数据类型转换、算数运算符

    常量.Scanner类.基本数据类型转换.算数运算符 变量和常量 常量 1.使用final关键字修饰,只能赋值一次,不可以修改值. 2.常量的名称使用全大写. 3.多个单词使用下划线分隔. publi ...

  4. SHA256算法加密工具类

    代码如下,请自取 /** * @description: SHA256算法加密 * @author: luolei * @Date: 2022-10-31 17:16 */ public class ...

  5. 2021CSP 游记

    总结 试机日: 我天,这学校什么垃圾电脑-- 比赛日: 1. 普及考试 总体上来说题目算简单 (只是我脑残),t1简单 \(O(1)\),学了数论就行,而 t2 看懂后按题意打一遍,再优化一下: 数组 ...

  6. 发现AI自我意识:进入混合增强只能的纪元

    执行性思维:人工智能的现实优势 如何解构人类的思维模型是一个跨多学科的综合性问题.本文仅针对AI领域发展方向预测以及理解,提出一个简化的模型.我认为人类的思维基于思考的目的性可以分为:执行性思维和创造 ...

  7. 3. Shell 条件判断

    重点: 条件测试. read. Shell 环境配置. case. for. find. xargs. gzip,bzip2,xz. tar. sed. 1)Shell 的配置文件 Bash Shel ...

  8. GUI界面实现小学生口算题卡功能(一)| 简要了解GUI

    上课没认真听,下课不好好写. 关于GUI,首先了解了一下什么是GUI: GUI(Graphical User Interface),图形用户界面.采用图形方式显示的计算机操作用户接口.与早期计算机使用 ...

  9. 小程序引入外部icon图标

    一.使用阿里巴巴图标库引入字体图标 阿里巴巴图标库:https://www.iconfont.cn/manage/index 选择合适的图标 收藏,在收藏中查看 选择:自己的项目 选择:第二个{fon ...

  10. freeswitch如何解决sip信令的NAT问题

    概述 freeswitch是一款简单好用的VOIP开源软交换平台. 公网环境复杂多变,客户环境更是各种稀奇古怪的问题. fs在针对sip信令的NAT问题有针对性的参数设置. 本文讨论的范围限于fs的公 ...