微信小程序音频播放

// 开启播放音频
startAudio(){
const innerAudioContext = uni.createInnerAudioContext();//创建并返回内部 audio
innerAudioContext.autoplay = false;//不自动播放
innerAudioContext.src =this.pageInfoBack.leaveReason;//音频的地址,不支持本地路径
innerAudioContext.obeyMuteSwitch=false;//即使用户打开了静音开关,也能继续发出声音
let self=this;
innerAudioContext.play(); // 点击按钮音频开始播放事件
self.isPlay=true;//显示播放图标
innerAudioContext.onEnded(res=>{
console.log("播放结束",res)
self.isPlay=false;
})
innerAudioContext.onError(err=>{
self.isPlay=false;
})
},

微信小程序音频播放的更多相关文章

  1. 微信小程序音频播放 InnerAudioContext 的用法

    今天项目上涉及到了微信小程序播放音频功能,所以今天跟着一些教程做了个简单的播放器 1.实现思路 刚开始想着有没有现成的组件可以直接用,找到了微信的媒体组件 audio,奈何看着 1.6.0版本开始,该 ...

  2. 微信小程序——音频播放器

    先来个效果图韵下味: 需求: 音频的播放,暂停,中间按钮状态的变化,播放时实时更新播放进度: 前进15s,后退15s: 进度条拖动. 一开始想着这3个功能应该挺简单的.不就是播放,暂停,前进,后退么~ ...

  3. 微信小程序 - 音频播放(1.2版本和1.2版本之后)

    不多说了,直接贴code // 1.2版本以后便不在维护 wx.getBackgroundAudioManager({ success:function(res){ var status =res.s ...

  4. 微信小程序音频背景播放

    由于微信小程序官方将音频的样式固定死了,往往再工作中和UI设计师设计出来的样式不符,故一般都采用背景音频播放来实现自定义的UI样式的音频播放,即使用官网API提供的BackgroundAudioMan ...

  5. 微信小程序音乐播放

    最近在写一个艾美食艾音乐的微信小程序,其中有用到音乐播放的功能,基本播放切换功能已经实现,但是在反复切换歌曲.重新进入歌曲以及单曲循环.列表循环的测试过程中还是发生了bug,特此写一篇文章,捋一下思路 ...

  6. 微信小程序音乐播放器

    写在前面 1.入门几天小白的作品,希望为您有帮助,有好的意见或简易烦请赐教 2.微信小程序审核音乐类别已经下架,想要发布选题需慎重.附一个参考链接,感谢https://www.hishop.com.c ...

  7. 微信小程序音频长度获取的问题

    小程序推荐使用wx.createInnerAudioContext()创建的innerAudioContext,我们也通过这个接口创建音频.音频的长度可以通过属性获取: 但是,给innerAudioC ...

  8. 微信小程序音乐播放器组件

    wxml <image bindtap="click" src="{{isPlay?'/images/':'/images/'}}"/> JS Pa ...

  9. 微信小程序---音乐播放和控制

    1.效果图如下: 2.代码如下: //index.js //获取应用实例 var app = getApp() Page({ data: { motto: 'Hello World', userInf ...

  10. 微信小程序(9)--音频及视频弹幕

    记录微信小程序音频及视频弹幕播放效果. 1.audio <!-- audio.wxml --> <audio poster="{{poster}}" name=& ...

随机推荐

  1. 拯救php性能的神器webman-初入门

    无意间发现的这个神器webman,真是秋名山上的腾源拓海! 该框架是workerman下的一个web开发的生态,我们可以先看看这里workerman的官方网站. workerman早有耳闻,知道它蛮厉 ...

  2. javascript正则获取a标签的href

    js正则获取a标签的href let str = '<a href="https://www.test.com" >test</a>' let reg = ...

  3. vue中去掉地址栏中的#

    mode设置成history就可以了

  4. Linux常用系统性能监控工具

    top 首先关于top命令,我想大家应该都挺熟悉的了. Linux系统下的top命令有点类似于Windows系统里的任务管理器,能够实时动态地给出系统中各个进程的资源占用状况,是Linux下比较常用的 ...

  5. Codeforces Round 856 (Div2)

    Counting Factorizations 任何一个正整数 \(m\) 都可以被唯一的分解为 \(p_1^{e_1} \cdot p_2^{e_2} \ldots p_k^{e_k}\) 的形式. ...

  6. 理解Java BlockingQueue

    数据结构与算法是天生一对. BlockingQueue叫做阻塞队列,在Java线程池相关的实现中有广泛的使用. BlockingQueue实现的功能如下: 当队列为空时,往队列中读数据将被阻塞. 当队 ...

  7. element-ui季度选择组件

    1.基于elementui开发的季度选择组件 2.调用 <el-quarter-picker v-model="start_time" :size="size&qu ...

  8. 【原创】ARM64 实时linux操作系xenomai4(EVL)构建安装简述

    目录 0 环境说明 1 内核构建 2 库编译 方式1 交叉编译 方式2 本地编译 3 测试 单元测试 hectic:EVL 上下文切换 latmus:latency测试 4 RK3588 xenoma ...

  9. 工欲善其事,必先利其器。如何玩转 VS Code?

    Visual Studio Code 作为广受好评的开发工具,已经被越来越多的开发者当作首选的开发工具.然而,你真的了解 VS Code 了吗?你真的会使用 VS Code,把 VS Code 的强大 ...

  10. 金Gien乐道 | 10月热点回顾

    ​ 收获之秋,中电金信Q4开篇捷报不断 ​ Q4开篇,中电金信迎来多个捷报.公司与青岛财通集团联合打造的核心业务系统(一体化业务平台)一期项目顺利投产上线并平稳运行:中标华南某全国性股份制商业银行新一 ...