How to enable seek for audio tag by Laravel5.5 Audioタグでシークを有効にする
1499 ワード
Laravel5.5で、mp3ファイルへのリンクを直接貼るのではなく、アプリケーションからバイナリを
返却するようにしたい時、Accept-Ranges、Content-Rangeヘッダをレスポンスに追加するとaudioタグでシークできるようになる
You can enable to seek in audio tags by adding "Accept-Ranges" and "Content-Range" headers.
controller
class AudioController extends Controller
{
public function loadAudio(Request $request)
{
//S3からオーディオファイルの取得
$audioFile = Storage::disk('s3')->get('test_audio.mp3');
$fullSize = strlen($audioFile);
$startByte = 0;
$endByte = $fullSize - 1;
return response($audioFile)
->header('Content-Type', 'audio/mpeg')
->header('Content-Length', $fullSize)
->header('Accept-Ranges', 'bytes')
->header('Content-Range', 'bytes '.$startByte.'-'.$startByte.'/'.$endByte);
}
}
view file
<audio controls>
<source src="{{ route('audio.route', compact('key')) }}" type="audio/wav">
Your browser does not support the audio element.
</audio>
参考URL:
https://forums.asp.net/t/2125393.aspx?Html+5+Audio+control+seek+is+not+working+
Author And Source
この問題について(How to enable seek for audio tag by Laravel5.5 Audioタグでシークを有効にする), 我々は、より多くの情報をここで見つけました https://qiita.com/masato1230/items/4e585e411b0625346aa9著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .