uni-app中uni.createInnerAudioContext()在老一点的设备上无法播放（安卓5.1）

uni-app中uni.createInnerAudioContext()在老一点的设备上无法播放（安卓5.1）

开发环境 版本号 项目创建方式
Windows win10 HBuilderX

产品分类：uniapp/H5

浏览器平台：手机系统浏览器

App下载地址或H5网址：https://www.zyftwl.com/test/#/pages/API/inner-audio/inner-audio

示例代码：

<template>
<view class="uni-padding-wrap">
<page-head title="audio"></page-head>
<view class="uni-common-mt">
<slider :value="position" :min="0" :max="duration" [@changing](/user/changing)="onchanging" [@change](/user/change)="onchange"></slider>
</view>
<!--
<view class="uni-common-mt play-time-area">
<text class="current-time">{{currentTime}}</text>
<text class="duration">{{duration}}</text>
</view> -->
<view class="play-button-area">
<image class="icon-play" :src="playImage" [@click](/user/click)="play"></image>
</view>
</view>
</template>

<script>
const audioUrl = '/static/music.mp3'
export default {
data() {
return {
title: "innerAudioContext",
isPlaying: false,
isPlayEnd: false,
currentTime: 0,
duration: 100
}
},
computed: {
position() {
return this.isPlayEnd ? 0 : this.currentTime;
},
playImage() {
return this.isPlaying ? "/static/pause.png" : "/static/play.png"
}
},
onLoad() {
this._isChanging = false;
this._audioContext = null;
this.createAudio();
},
onUnload() {
if (this._audioContext != null && this.isPlaying) {
this.stop();
}
},
methods: {
createAudio() {
var innerAudioContext = this._audioContext = uni.createInnerAudioContext();
innerAudioContext.autoplay = false;
innerAudioContext.src = audioUrl;
innerAudioContext.onPlay(() => {
console.log('开始播放');
});
innerAudioContext.onTimeUpdate((e) => {
if (this._isChanging === true) {
return;
}
this.currentTime = innerAudioContext.currentTime || 0;
this.duration = innerAudioContext.duration || 0;
});
innerAudioContext.onEnded(() => {
this.currentTime = 0;
this.isPlaying = false;
this.isPlayEnd = true;
});
innerAudioContext.onError((res) => {
this.isPlaying = false;
console.log(res.errMsg);
console.log(res.errCode);
});
return innerAudioContext;
},
onchanging() {
this._isChanging = true;
},
onchange(e) {
console.log(e.detail.value);
console.log(typeof e.detail.value);
this._audioContext.seek(e.detail.value);
this._isChanging = false;
},
play() {
if (this.isPlaying) {
this.pause();
return;
}
this.isPlaying = true;
this._audioContext.play();
this.isPlayEnd = false;
},
pause() {
this._audioContext.pause();
this.isPlaying = false;
},
stop() {
this._audioContext.stop();
this.isPlaying = false;
}
}
}
</script>

<style>
.play-time-area {
display: flex;
flex-direction: row;
margin-top: 20px;
}  

.duration {  
margin-left: auto;  
}  

.play-button-area {  
display: flex;  
flex-direction: row;  
justify-content: center;  
margin-top: 50px;  
}  

.icon-play {  
width: 60px;  
height: 60px;  
}  
</style>

更多关于uni-app中uni.createInnerAudioContext()在老一点的设备上无法播放（安卓5.1）的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app中uni.createInnerAudioContext()在老一点的设备上无法播放（安卓5.1）的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 Uni-App 中使用 uni.createInnerAudioContext() 时，如果在老设备（如 Android 5.1）上无法播放音频，可能是由于以下原因导致的：

1. 音频格式不支持

  • 原因: 老版本的 Android 设备可能不支持某些音频格式（如 MP3、AAC 等）。
  • 解决方案:
    • 确保音频文件是兼容的格式，如 .mp3 或 .wav。
    • 可以尝试使用不同的音频格式测试。

2. 音频文件路径问题

  • 原因: 如果音频文件路径不正确或无法访问，音频将无法播放。
  • 解决方案:
    • 确保音频文件的路径正确，可以使用相对路径或网络 URL。
    • 如果是网络 URL，确保文件可以通过网络访问。

3. 设备兼容性问题

  • 原因: 老版本的 Android 设备可能存在兼容性问题，导致 uni.createInnerAudioContext() 无法正常工作。
  • 解决方案:
    • 尝试使用 uni.getSystemInfoSync() 获取设备信息，根据设备信息做兼容性处理。
    • 如果问题仍然存在，可以考虑使用其他音频播放方案，如 WebView 嵌入 HTML5 的 <audio> 标签。

4. 权限问题

  • 原因: 老版本的 Android 设备可能需要手动请求音频播放权限。
  • 解决方案:
    • 确保在 manifest.json 中配置了正确的权限：
      {
  "permission": {
    "android": {
      "uses-permission": [
        "android.permission.INTERNET",
        "android.permission.WRITE_EXTERNAL_STORAGE",
        "android.permission.READ_EXTERNAL_STORAGE"
      ]
    }
  }
}
    • 在代码中动态请求权限（如果需要）。

5. 代码逻辑问题

  • 原因: 代码中可能存在逻辑错误，导致音频无法播放。
  • 解决方案:
    • 确保在播放音频之前调用了 play() 方法。
    • 检查是否有错误回调，处理错误信息。

6. 低版本 Android 系统的限制

  • 原因: Android 5.1 是较老的系统版本，可能存在一些限制或 bug。
  • 解决方案:
    • 尝试在最新的 Android 系统上测试，确认是否是系统版本的问题。
    • 如果必须支持老版本设备，可以考虑使用其他音频播放库或插件。

示例代码

以下是一个使用 uni.createInnerAudioContext() 的示例代码：

const innerAudioContext = uni.createInnerAudioContext();

innerAudioContext.src = '/static/audio/example.mp3'; // 确保路径正确
innerAudioContext.autoplay = false;

innerAudioContext.onPlay(() => {
  console.log('开始播放');
});

innerAudioContext.onError((err) => {
  console.error('播放错误', err);
});

// 播放音频
innerAudioContext.play();
回到顶部