1. 程式人生 > 實用技巧 >移動端Ios 不能使用audio 自帶的canplay事件來獲取音訊的總時長

移動端Ios 不能使用audio 自帶的canplay事件來獲取音訊的總時長

關於Vue使用Audio的文章可以參考

https://blog.csdn.net/weixin_33695450/article/details/91462679

我使用的時候出現一個問題發現 IOS在進入頁面時並不能獲取到duration屬性

也就是並不能獲取總時長,但是點開播放之後就可以獲取到,百度後發現蘋果開發者平臺上有說明

https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html

意思大概就是在Safari 5.0及更高版本中支援preload屬性。iOS上的Safari從不預載入,所以找到了問題所在

解決方法如下

      mounted() {
        var musicDom = $('#audio')[0];
        let that = this
        musicDom.load();
        musicDom.onloadedmetadata = function () {
          that.duration = musicDom.duration;
          console.log('載入的匿名函式',that.duration);
        };
      }

在vue的mounted方法中 把該dom元素load一次