收藏
回答

使用getBackgroundAudioManager,发现有MP3无法播放

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug getBackgroundAudioManager 客户端 wechat 6.7.3.1360 android6.0.1 wechat 6.7.3.1360

- 当前 Bug 的表现(可附上截图)

1、音频文件在本地或其他播放器中正常。但有的在小程序中播放不了。例如:

https://cms.hanzhigu.com/upload/audio/info/20190111/beb52979-2e0e-44c8-9d2e-dface3aa832b.mp3

2、在小程序中使用的组件是wx.getBackgroundAudioManager,上面这个音频放不了。

3、我把小程序官方提供的音频代码中SRC修改为这个,也播放不了,界面如下图,一动不动。也无错误打印信息。

使用背景播放器



- 预期表现

希望能正常播放所有的mp3文件或者支持的音频格式文件。而不是有的能播放,有的不能播放(都是MP3)

- 复现路径


- 提供一个最简复现 Demo

/*JS文件====================================================*/

const audioManager = wx.getBackgroundAudioManager();


//打开这个注释的mp3源,就可以播放

const dataUrl = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'


//使用下面这个播放源就无法播放。两个音频文件在浏览器中或其他本地都能正常播放

//const dataUrl = "https://cms.hanzhigu.com//upload/audio/info/20190111/beb52979-2e0e-44c8-9d2e-dface3aa832b.mp3

Page({

onShareAppMessage() {

return {

title: '背景音乐',

path: 'page/API/pages/background-audio/background-audio'

}

},

onLoad() {

this._enableInterval()

if (app.globalData.backgroundAudioPlaying) {

this.setData({

playing: true

})

}

},

data: {

playing: false,

playTime: 0,

formatedPlayTime: '00:00:00'

},

play() {

const that = this

audioManager.title = '这是测试';

audioManager.epname = '此时此刻';

audioManager.singer = 'XXX';

audioManager.coverImgUrl = 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000',

audioManager.src = dataUrl;

that.setData({

playing: true

});

this._enableInterval()

app.globalData.backgroundAudioPlaying = true

},

seek(e) {

clearInterval(this.updateInterval)

const that = this

audioManager.seek(e.detail.value);

setTimeout(function() {

that._enableInterval()

}, 2000)

},

pause() {

const that = this

audioManager.pause();

that.setData({

playing: false

});

app.globalData.backgroundAudioPlaying = false

},

stop() {

const that = this

audioManager.stop();

that.setData({

playing: false

});

app.globalData.backgroundAudioPlaying = false

},


_enableInterval() {

const that = this

function update() {

that.setData({

playTime: parseInt(audioManager.currentTime),

formatedPlayTime: util.formatTime(audioManager.currentTime + 1)

})

}

update()

this.updateInterval = setInterval(update, 500)

},

onUnload() {

clearInterval(this.updateInterval)

}

})

/*WXML-----------------------------------------------*/

<view class="container">

<template is="head" data="{{title: 'backgroundAudio'}}"/>

<view class="page-section">

<view class="page-body-info">

<text class="time-big">{{formatedPlayTime}}</text>

<slider class="slider" min="0" max="1777" step="1" value="{{playTime}}" bindchange="seek"></slider>

<view class="play-time">

<text>00:00</text>

<text>29:37</text>

</view>

</view>

<view class="page-body-text tc">注意:离开当前页面后背景音乐将保持播放,但退出小程序将停止</view>

<view class="page-body-buttons">

<block wx:if="{{playing === true}}">

<view class="page-body-button" bindtap="stop">

<image src="/image/stop.png"></image>

</view>

<view class="page-body-button" bindtap="pause">

<image src="/image/pause.png"></image>

</view>

</block>

<block wx:if="{{playing === false}}">

<view class="page-body-button"></view>

<view class="page-body-button" bindtap="play">

<image src="/image/play.png"></image>

</view>

</block>

<view class="page-body-button"></view>

</view>

</view>

<template is="foot" />

</view>

/*wxss------------------------------------*/

image {

width: 150rpx;

height: 150rpx;

}

.page-body-wrapper {

margin-top: 0;

}

.page-body-info {

padding-bottom: 50rpx;

}

.time-big {

font-size: 60rpx;

margin: 20rpx;

}

.slider {

width: 650rpx;

}

.play-time {

font-size: 28rpx;

width: 700rpx;

padding: 20rpx 0;

display: flex;

justify-content: space-between;

box-sizing: border-box;

}

.page-body-buttons {

display: flex;

justify-content: space-around;

margin-top: 100rpx;

}

.page-body-button {

width: 250rpx;

text-align: center;

}


最后一次编辑于  2019-01-11
回答关注问题邀请回答
收藏

2 个回答

登录 后发表内容