当前位置: 首页 > news >正文

vue使用Web Speech API实现语音播报

SpeechSynthesisUtterance对象用于表示要播放的语音内容,SpeechSynthesis对象则用于控制语音的播放、暂停、停止等操作。

const synth = window.speechSynthesis
const msg = new SpeechSynthesisUtterance()
// 语音播放
const playVoice = (text) => {synth.cancel()msg.text = textmsg.lang = "zh-CN"msg.volume = 1msg.rate = 1msg.pitch = 1msg.onend = () => {// 语音播放结束调用的方法,可以在里面写一些逻辑}synth.speak(msg)
}
// 停止播放
const stopVoice = (e) => {msg.text = emsg.lang = "zh-CN"synth.cancel(msg)
}

问题点:

       不兼容chrome。

解决方法:

       先调用下window.speechSynthesis.cancel()方法。

参考文献:

webspeech api - speechSynthesis.speak not working in chrome - Stack Overflow

javascript - SpeechSynthesis - Onend 在语音结束前触发 - IT工具网

        

http://www.lryc.cn/news/216883.html

相关文章:

  • MVC5_Day1(Razor视图引擎)
  • 超全整理,Jmeter性能测试-脚本error报错排查/分布式压测(详全)
  • vscode开启emmet语法
  • 07、vue : 无法加载文件 C:\Users\JH\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。
  • 利用移动互联、物联网、智能算法、地理信息系统、大数据分析等信息技术开发的智慧工地云平台源码
  • 海康多相机同步取流保存图片
  • win10 + vs2017 + cmake3.17编译OSG-3.4.1
  • Excel VBA开发基本语句说明
  • 应用在智能空调中的数字温度传感芯片
  • Qt界面美化之Qt Style Sheets
  • prometheus监控告警部署(k8s内部)
  • 数字孪生特高压电网三维可视化平台实现能源智能管理
  • 12.JavaScript(WebAPI) - JS api文献精解
  • 亚马逊云科技:让生成式AI真正走向普惠
  • Java web(四):JSP
  • HarmonyOS(二)—— 初识ArkTS开发语言(中)之ArkTS的由来和演进
  • 电子产品上架Temu平台需要做什么认证?UL测试报告
  • 热点报告 | 健身人群抵抗入冬肥,Dirtyfit引领23秋冬潮流?
  • C++变参模板的使用
  • 【二、http】go的http基本请求设置(设置查询参数、定制请求头)get和post类似
  • [学习笔记]python绘制图中图(绘制站点分布图)
  • 回归预测 | Matlab实现POA-CNN-SVM鹈鹕算法优化卷积神经网络-支持向量机多变量回归预测
  • React 学习笔记
  • 单链表的查找(按值查找、按位查找)(数据结构与算法)
  • Qt 6.6 发布
  • unity工程
  • 蓝桥杯官网练习题(地址转换)
  • 力扣labuladong——一刷day19
  • MyBatis无法读取XML中的Method的乌龙事件
  • LeetCode----76. 最小覆盖子串