使用小程序云开发添加背景音乐

微信小程序 专栏收录该内容
0 篇文章 0 订阅

使用小程序云开发添加背景音乐且实现后台播放

在网上看了很多种方法,有一些对浏览器有一定的要求,于是懒癌患者想出了另一种办法

首先,要在小程序里添加音频,需要在js里写一段代码:
(此方法来自微信官方https://developers.weixin.qq.com/miniprogram/dev/api/media/background-audio/BackgroundAudioManager.html

//index.js
const backgroundAudioManager = wx.getBackgroundAudioManager()

backgroundAudioManager.title = '此时此刻'
backgroundAudioManager.epname = '此时此刻'
backgroundAudioManager.singer = '许巍'
backgroundAudioManager.coverImgUrl = 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000'
// 设置了 src 之后会自动播放
backgroundAudioManager.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'

如果想要让音乐继续在后台播放,需要在app.json里加入

"requiredBackgroundModes": [
    "audio"
  ]

此时小程序应该已经可以顺利播放许巍的此时此刻了
接下来把歌曲换成自己想要的
标题和歌手的更改请自行参考官方文档,非常简单

在网上提前下载好MP3文件
使用微信小程序的云开发功能 上传文件

微信云开发

上传文件后,点击文件名就会出现文件的详细信息
复制其中的下载地址就好啦
把下载地址写在src里!
图片同理

下载地址

千万记得,把权限改成所有用户可读,仅创建者可写!!!不然无法访问!!!
权限设置

至此,顺利播放
并且手机上测试可以后台播放
文件大一点也没啥关系
在这里插入图片描述

  • 2
    点赞
  • 0
    评论
  • 19
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值