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

vue项目打包成H5apk中使用语音播放

利用浏览器语音播放api功能,在vue项目中调用api实现语音播报。
在mounted生命周期函数中获取浏览器的SpeechSynthesis API

  data() {return {speech: null,};},mounted() {if ("SpeechSynthesisUtterance" in window) {this.speech = window.speechSynthesis;} else {// eslint-disable-next-line no-consoleconsole.log("不支持语音播放API");}},

methods 中方法

 methods: {//调用业务handleConfirm() {let t = `请 1号 到前台取餐`;this.speechInit(`${t}`);},//初始化speechInit(text) {let utterThis = new SpeechSynthesisUtterance(text);utterThis.pitch = 1; // 音高utterThis.rate = 1; // 语速utterThis.volume = 1; // 音量utterThis.lang = "zh-CN"; // 播报语言this.speech.speak(utterThis);},
}

通过HBuilder X在打包成apk安装包时,需要在manifest.json文件中添加对应的权限设置。

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

相关文章:

  • windows:批处理bat实例
  • websocket php教程
  • 【操作系统】调度算法的评价指标和三种调度算法
  • CSS详细基础(三)复合选择器
  • LeetCode【2251. 花期内花的数目】
  • 大数据(九):数据可视化(一)
  • 讲讲项目里的仪表盘编辑器(二)
  • 文心一言 VS 讯飞星火 VS chatgpt (102)-- 算法导论9.3 8题
  • axios添加缓存请求,防止多次请求,单页面多个同一组件造成多次请求解决方案
  • Java包装类与自动拆箱装箱
  • 基于SpringBoot网上超市的设计与实现【附万字文档(LW)和搭建文档】
  • 二、C++项目:仿muduo库实现并发服务器之时间轮的设计
  • 计算机竞赛 深度学习OCR中文识别 - opencv python
  • 蓝桥等考Python组别五级003
  • 学之思项目第一天-完成项目搭建
  • pandas--->CSV / JSON
  • LeetCode算法二叉树—116. 填充每个节点的下一个右侧节点指针
  • 二、2023.9.28.C++基础endC++内存end.2
  • DevSecOps 将会嵌入 DevOps
  • 不同管径地下管线的地质雷达响应特征分析
  • 【接口测试学习】白盒测试 接口测试 自动化测试
  • 7.网络原理之TCP_IP(下)
  • Docker Dockerfile解析
  • 浏览器从输入URL到页面展示这个过程中都经历了什么
  • 2023-09-22 monetdb-事务管理-乐观并发控制-记录
  • 蓝桥等考Python组别四级008
  • SpringMVC 学习(二)Hello SpringMVC
  • 交换机之间配置手动|静态链路聚合
  • Shiro高级及SaaS-HRM的认证授权
  • eclipse svn插件安装