この記事はアピリッツの技術ブログ「DoRuby」から移行した記事です。情報が古い可能性がありますのでご注意ください。
部分android機種の標準ブラウザにはにaudio.jsがうまく動かないaudio.jsは、みなさんご存知のようにMP3音声ファイルの再生にとても便利なjsプラグインです。
しかし、部分android機種の標準ブラウザにはにaudio.jsがうまく動かない現象があります。
うまく動かないというのは、
①曲再生のシークンは、曲再生後、瞬間終了
②曲再生時間は0のまま
③前進、バックの操作が効かない
のことです。
jsの中身を確認すると、loadProgressファンクションには、下記のif分があります。
if(this.element.buffered!=null&&this.element.buffered.length){
if(!this.loadStartedCalled)this.loadStartedCalled=this.loadStarted();
this.loadedPercent=this.element.buffered.end(this.element.buffered.length-1)/this.duration;
this.settings.loadProgress.apply(this,[this.loadedPercent])
}
if分岐に入って、this.loadStarted()が呼ばれると、曲の再生時間this.duration(②)がセットされます。
さらにthis.loadedPercent(①)が正しく計算されます。
さらに前進、バック時(③)、this.loadedPercentを使うので、前進、バック動作は正しく動作します。
androidの部分機種には、this.element.bufferedが取れなくて、if分に入れず、動作がおかしくなります。
あまり強引な解決方法ですが、
if(this.element.buffered!=null&&this.element.buffered.length){
:
}
//追加
else userAgentを判断して、androidかつ標準ブラウザの場合{
//↑同じ処理
}
但し、androidかつ標準ブラウザの判断は難しい。
最初、/(android)/i.test(navigator.userAgent)&&!(/(chrome)/i.test(navigator.userAgent))
で、androidかつchrome以外で、行けるかなと思っていましたが、
どうも、一部機種には、標準ブラウザでもuserAgentに”chrome”という文字が入っています。
残念ですが、完璧の解決方法が見つかりません。audio.js使う時、注意しましょう。