uni-app ios小程序真机音频有播放但没有声音

uni-app ios小程序真机音频有播放但没有声音

开发环境 版本号 项目创建方式
Windows win10 HBuilderX 
操作步骤：
```js
playAudio() {  
  if (this.innerAudioContext) {  
    // 获取当前播放状态  
    let paused = this.innerAudioContext.paused;  
    console.log("paused", paused);  
    if (paused) {  
      this.innerAudioContext.play();  
    } else {  
      this.innerAudioContext.pause();  
    }  
  } else {  
    uni.showToast({  
      icon: "none",  
      title: "音频加载中...",  
    });  
    this.innerAudioContext = uni.createInnerAudioContext();  
    console.log(" this.innerAudioContext", this.innerAudioContext);  
    this.innerAudioContext.autoplay = true;  
    this.innerAudioContext.obeyMuteSwitch = false;  
    // this.innerAudioContext.src = this.audioUrl;  
    this.innerAudioContext.src =  
      "http://img.artstudent.cn/pr/2021-03-03/049237b0092943d3b9c4d9ce04f86bc1.mp3";  
    console.log(this.audioUrl);  
    console.log(" this.innerAudioContext", this.innerAudioContext);  
    this.innerAudioContext.onPlay(() => {  
      console.log("onplay");  
      this.playStatus = true;  
    });  
    this.innerAudioContext.onPause(() => {  
      this.playStatus = false;  
    });  
    this.innerAudioContext.onEnded(() => {  
      this.playStatus = false;  
    });  

    this.innerAudioContext.onStop(() => {  
      this.playStatus = false;  
    });  
    this.innerAudioContext.onError((res) => {  
      this.playStatus = false;  
      uni.showToast({  
        icon: "none",  
        title: res.errMsg,  
      });  
      console.log(res);  
    });  
  }  
},

预期结果：

在IOS小程序中可以播放

实际结果：

播放事件有触发，无报错，但是没有声音

bug描述：

音频在微信开发工具里面可以播放、在安卓小程序可以播放、在ios微信小程序中无法播放(播放事件有触发，但是没有声音)

更多关于uni-app ios小程序真机音频有播放但没有声音的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

单独使用微信小程序测试（不使用 uni-app）看下，如果仍然存在，反馈到微信小程序社区

更多关于uni-app ios小程序真机音频有播放但没有声音的实战教程也可以访问 https://www.itying.com/category-93-b0.html


静音播放的问题导致 created() {
// 微信ios静音播放无声音问题
// #ifdef MP-WEIXIN
if (wx.setInnerAudioOption) {
wx.setInnerAudioOption({
obeyMuteSwitch: false,
});
}
// #endif
}, 已经没有问题了，谢谢

根据您提供的代码和问题描述，这是一个在 iOS 微信小程序真机上音频能触发播放事件但没有声音的典型问题。结合 uni-app 和微信小程序平台的特性，问题很可能出在以下两个方面：

1. 音频源地址协议问题（最可能的原因）

您代码中使用的音频地址是 http:// 协议：

this.innerAudioContext.src = "http://img.artstudent.cn/pr/2021-03-03/049237b0092943d3b9c4d9ce04f86bc1.mp3";

原因分析： iOS 系统（包括其上的微信小程序）对网络资源的安全策略更为严格。从 iOS 10 开始，苹果要求所有通过网络加载的媒体资源（如音频、视频）必须使用 HTTPS 协议，使用 HTTP 协议的资源在静默状态下可能被阻止加载或播放，这直接导致了“有播放事件但无声音”的现象。而微信开发者工具和安卓环境对此限制可能不那么严格。

解决方案：

  • 将音频资源服务器升级为支持 HTTPS。这是最根本的解决方案。
  • 如果资源在您自己的服务器上，请部署 SSL 证书。
  • 如果使用第三方资源，请确保其提供 HTTPS 链接。
  • 临时测试时，可以将音频文件放在项目的 static 目录下，使用相对路径引用（但这仅适用于固定音频文件，不适用于网络动态音频）。

2. 音频上下文生命周期与播放时机

您的代码逻辑中，音频的创建、设置 src 和设置 autoplay = true 是同步连续执行的。在部分 iOS 环境下，音频源可能尚未完全加载或解码，autoplay 指令可能未能及时生效。

建议优化： 虽然这可能不是主因，但良好的实践是监听 canplay 或 canplaythrough 事件，确保音频已准备好后再尝试播放，尤其是在网络资源的情况下。

修改示例：

this.innerAudioContext = uni.createInnerAudioContext();
this.innerAudioContext.src = "https://..."; // 务必使用HTTPS
this.innerAudioContext.obeyMuteSwitch = false;

// 监听可以开始播放的事件
this.innerAudioContext.onCanplay(() => {
  console.log('音频可以播放');
  // 如果仍需自动播放，可以在这里调用 play()
  // this.innerAudioContext.play();
});

this.innerAudioContext.onError((res) => {
  console.error('音频播放错误:', res);
  // 这里可以更详细地输出错误信息，有助于诊断
});

// 设置autoplay为true（如果onCanplay中不手动play）
this.innerAudioContext.autoplay = true;
回到顶部