一、vue中解决chrome浏览器自动播放音频
需求
有新订单的时候，页面自动语音提示和弹出提示框；
问题
chrome浏览器在18年4月起，就在桌面浏览器全面禁止了音视频的自动播放功能。严格地来说，是Chrome不允许在用户对网页进行触发之前播放音频。不光是这样，在页面加载完毕的情况下，用户没有click、dbclick、touch等主动交互行为，使用js直接调用.play() 方法的话，chrome都会抛出如下错误：Uncaught (in promise) DOMException；
解决
在网上找了很多方法都不行，最后试出一种可行：语音播放显示出来才可以自动播放语音，如下图；
上代码：
//这里就是语音播放器，必须显示出来 <audio controls="controls" :src="/UploadFiles/2021-04-02/sound">功能的全部代码：
<div> <v-btn color="lime lighten-1" @click="handleDispatch" small><v-icon left>mdi-account</v-icon>人工派单 </v-btn> //这里就是语音播放器，必须显示出来 <audio controls="controls" :src="/UploadFiles/2021-04-02/sound">二、MP3文件上传到线上，webpack打包丢失
去看webpack.config.js文件的配置,这里MP3会打包到media文件，但是没生成；
{ test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\"htmlcode"><script> //语音的路径（当模块引入，webpack好将MP3打包） import sounds from '@/assets/sound/1.mp3'; export default { data() { return { sound: sounds, } }最后就打包成功
最后看到一种，直接URL使用百度播报，我没试过o.o 他的微博：以下代码来自https://www.cnblogs.com/gfweb/p/11726365.html
1,在工具文件夹utils，创建一个js文件 （voicePrompt.js）
function voicePrompt (text){ new Audio('http://tts.baidu.com/text2audio"htmlcode">import * as voicePromptFun from './utils/voicePrompt' Vue.prototype.voicePrompt = voicePromptFun.voicePrompt //语音提醒3在其他页面调用
this.voicePrompt('皮卡丘');最新资源
- 博主分享《美末2RE》PS5 Pro运行画面 玩家仍不买
- 《双城之战2》超多新歌MV发布：林肯公园再次献声
- 群星《说唱梦工厂 第11期》[320K/MP3][63.25MB]
- 群星《说唱梦工厂 第11期》[FLAC/分轨][343.07M
- 群星《闪光的夏天 第5期》[320K/MP3][79.35MB]
- 秀兰玛雅.1999-友情人【大旗】【WAV+CUE】
- 小米.2020-我想在城市里当一个乡下人【滚石】【
- 齐豫.2003-THE.UNHEARD.OF.CHYI.3CD【苏活音乐】
- 黄乙玲1986-讲什么山盟海誓[日本东芝版][WAV+CU
- 曾庆瑜1991-柔情陷阱[台湾派森东芝版][WAV+CUE]
