微信小程序音頻IOS無法播放問題總結

Soarkey 發布于2019-08-23 12:39 / 3248人閱讀

摘要：問題微信小程序，將文字轉換為語音后，使用音頻進行播放。在安卓手機下可以正常播放，在下不行。需要對接口的文本字符串參數進行編碼比如哈哈哈哈哈哈哈哈哈沒有做編碼，直接上文本的，也會出現安卓行不行的情況。

【問題】

微信小程序，將文字轉換為語音后，使用音頻進行播放。在安卓手機下可以正常播放，在IOS下不行。

【環境】

微信小程序庫版本2.3.0
百度語音合成服務

【解決方法】

正確代碼：

//創建一個音頻實例
const myaudio = wx.createInnerAudioContext();

//設置obeyMuteSwitch: false（不遵循系統靜音開關，即使用戶打開了靜音開關，也能繼續發出聲音）
//設置autoplay: true（自動開始播放）
if (wx.setInnerAudioOption) {
  wx.setInnerAudioOption({
    obeyMuteSwitch: false,
    autoplay: true
  })
}else {
  myaudio.obeyMuteSwitch = false;
  myaudio.autoplay = true;
}

//監聽各個階段
myaudio.onCanplay(() => {
  console.log("可以播放");
});
myaudio.onPlay(() => {
  console.log("監聽到音頻開始播放");
});
myaudio.onEnded(() => {
  console.log("音頻自然播放結束事件");
});
myaudio.onStop(() => {
  console.log("音頻停止事件");
});
myaudio.onError((res) => {
  console.log(res.errMsg);
  console.log(res.errCode);
});
myaudio.onWaiting((res) => {
  console.log("音頻加載中事件，當音頻因為數據不足，需要停下來加載時會觸發")
});


//設置播放鏈接
myaudio.src = "https://tsn.baidu.com/text2audio?lan=zh&ctp=1&cuid=abcdxxx&tok=24.b63*************************************.1543030920.282335-11522973&tex=" + encodeURIComponent(encodeURIComponent("哈哈哈哈哈哈哈哈哈")) + "&vol=5&per=0&spd=5&pit=5&aue=324.b6306a3dff68e153a0d5656b3a78bd5e.2592000.1543030920.282335-11522973";

//播放
myaudio.play();

這樣，在安卓和IOS下都可以正常播放了。

【問題總結】

為什么總是播放不了？注意下面兩點：

1、這個播放鏈接返回的必須是格式正確的音頻文件

所以如果換一個鏈接就能播放了，那可能就說明你原來的鏈接返回了錯誤的音頻格式。

原本我的播放鏈接是：

myaudio.src = "https://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=5&text=" + encodeURIComponent("哈哈哈哈哈哈哈哈哈");

這個tts.baidu.com和tsn.baidu.com長得非常像，為什么一開始用的不是tsn？是因為在網上搜索到的好多案例都是用的tts，而且tsn需要token參數，這個參數要么需要從百度AI開放平臺手動獲取，要么需要調用獲取token的接口，而這個接口又不支持瀏覽器跨域，因此需要從服務端獲取token或者每隔30天手動輸入更新，我嫌麻煩，所以一開始先用了tts。

tts在安卓下確實可以正常播放，可以看到Console中依次打印出了：

監聽到音頻開始播放
音頻加載中事件，當音頻因為數據不足，需要停下來加載時會觸發
可以播放
音頻自然播放結束事件

但是在IOS下就無法播放了，Console中依次打印出了：

音頻加載中事件，當音頻因為數據不足，需要停下來加載時會觸發
INNERERRCODE:-11850, ERRMSG:操作停止
10002

根據官方的說法，應該是因為返回的音頻格式IOS不支持。（https://developers.weixin.qq....）如果返回的音頻格式正確，是可以正常播放的。

ps：后來查了一下發現tts這個接口應該只是他們內部demo地址，所以還是使用正式的tsn吧。

2、需要對tsn接口的文本字符串參數進行編碼
比如： encodeURIComponent(encodeURIComponent("哈哈哈哈哈哈哈哈哈"));

沒有做編碼，直接上文本的，也會出現安卓行IOS不行的情況。

GPU云服務器云服務器 ios webrtc 音頻播放微信小程序支付微信小程序部署微信小程序搭建

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/98904.html

ios微信下vue項目組件切換并自動播放音頻的解決方案

摘要：最近在做一個英語答題項目項目需求是通過答題取的成績答題的題型是分為聽音選圖看圖選詞和填空題項目總共分為了個頁面開始頁答題頁和結束頁面答題頁關于每種題型我做了相應的組件每次切換題目的時候顯示對應的的組件要求聽音選圖的時候會自動播放音頻慣例下的最近在做一個英語答題項目 , 項目需求是通過答題取的成績 , 答題的題型是分為 , 聽音選圖 , 看圖選詞 , 和填空題 . 項目總共分為了3個頁...

LinkedME2016 2019-08-26 11:42 評論0 收藏0
開發 | 微信小程序audio音頻播放組件+api_wx.createAudioContext

摘要：引言是微信小程序中的音頻組件，可以輕松實現小程序中播放停止音頻等自定義動作。引言： audio是微信小程序中的音頻組件，可以輕松實現小程序中播放/停止音頻等自定義動作。附上微信小程序audio組件的相關屬性說明：https://mp.weixin.qq.com/debu... 本次將通過小程序audio的 poster、name、author、src、id、controls 屬性，...

gekylin 2019-08-15 14:01 評論0 收藏0
微信小程序調研文檔

摘要：關于微信小程序之前只是聽說，并沒有引起我太大的興趣。剛好團隊內部有個需求需要微信小程序。暫時沒有上線經歷，沒辦法給出這個時間微信小程序的代碼包大小當前限制是。關于微信小程序之前只是聽說，并沒有引起我太大的興趣。周一被小程序刷屏，然后就順手搜索了解了一下。發現小程序已經火遍了整個程序員圈子。剛好團隊內部有個需求需要微信小程序。就緊急對微信小程序進行了調研，閱讀過開發者文檔后總結了以下的...

kidsamong 2019-08-20 13:44 評論0 收藏0