2017-03-26 13 views
3

反応アプリケーションでは単純なHTML5オーディオタグを使用したいと思います。私のコンポーネントは次のようになります:反応のHTML5オーディオタグ

import React from 'react' 

class AudioPlayer extends React.Component { 
    render() { 
    return (
     <div> 
     <audio ref="audio_tag" src="./static/music/foo.mp3" controls autoPlay/> 
     </div> 
    ); 
    } 
} 

export default AudioPlayer; 

しかし、それは再生されません。私もエラーはありません。私は今、私のアプリのすべての単一のフォルダにmp3ファイルを入れて、別のパスなどを試してみましたが、それはそれを認識していないようです。多分私は何か些細なことを見逃していますか?

+0

ユーザイベント内から再生するときに機能するかどうかを確認します(したがって、ボタンと、.play()でオーディオを再生するハンドラを追加します)。 – samsonthehero

+0

さて、私はそれを試みました。私は以下を取得します: '未知(約束)DOMException:その要素には、サポートされているソースがありません。 ' –

+0

[コードは正常に動作します](https://codepen.io/jrunning/pen/xrEYyq?editors=1010)ブラウザがオーディオファイルをロードできない可能性があります。残念ながら、ファイルをどのように提供しているかについては何も教えてくれていないので、お手伝いできません。 –

答えて

0

私は誤って壊れたオーディオファイルを使用していたので、私の解決策がなぜ機能しなかったのかがわかります。上記のコードは、Jordan Runningが指摘しているとおり、これを答えとして残しておきます。

関連する問題