微信小程序音频播放

// 开启播放音频
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. npm link的作用——避免频繁发布更新

    web-components  里面的组件库 修改频繁 可以使用link 创建链接,引用放就不需要每次都重新发布重新安装更新了 功能 在本地开发npm模块的时候,我们可以使用npm link命令,将n ...

  2. Mysql分页实现及优化

    通常,我们会采用ORDER BY LIMIT start, offset 的方式来进行分页查询.例如下面这个SQL: SELECT * FROM `t1` WHERE ftype=1 ORDER BY ...

  3. 成为Java GC专家系列(3) — 如何优化Java垃圾回收机制

    本文是成为Java GC专家系列文章的第三篇.在第一篇<成为JavaGC专家Part I - 深入浅出Java垃圾回收机制>中我们学习了不同GC算法的执行过程,GC是如何工作的,什么是新生 ...

  4. 基于Github gist的代码片段管理工具Lepton

    Lepton主要功能 无限制的公共/私人片段 无限制的标签 语言组 Markdown支持 Jupyter Notebook查看器支持 macOS / Win / Linux客户端 GitHub Ent ...

  5. BeautifulSoup(bs4)细致讲解

    BeautifulSoup(bs4) BeautifulSoup是python的一个库,最主要的功能是从网页爬取数据,官方是这样解释的:BeautifulSoup提供一些简单,python式函数来处理 ...

  6. 获取n级父目录名称

    DirectoryInfo GetPrant(DirectoryInfo path, int level) { DirectoryInfo temp = null; if (level > 1) ...

  7. 调用非托管dll常出现的bug及解决办法

    转自http://www.51testing.com/html/00/n-832200.html C和C++有很多好的类库的沉淀,在.NET中,完全抛弃它们而重头再来是非常不明智的.也是不现实的,所以 ...

  8. MQ系列 | RabbitMQ 消息确认机制

    RabbitMQ 消息确认机制 温馨提示:基于JDK17.SpringBoot 2.1.8.RELEASE 版本,由于RabbitMQ 在 SpringBoot3+ 的配置项有所不同, 所以请严格按照 ...

  9. 内网穿透之http代理服务器

    在公网访问内网http服务可以用内网穿透工具,例如frp和nps等优秀工具.但我发现这类工具会在服务器启动不止一个端口,对于有些网络审查来说很容易发现在进行内网穿透.因此我想是否可以只在服务器启动一个 ...

  10. 在 PdfSharp 中使用私有字体

    在 PdfSharp 中使用私有字体 在 PdfSharp 1.5 中提供了在 Web 服务器上使用私有字体的示例,见:http://www.pdfsharp.net/wiki/(X(1)S(mg0w ...