勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

mp3ファイルのアップロードと再生方法

   2024/02/25  PHP HTML

mp3ファイルをformでアップロードしたかったのと、Webサイト上で再生したかった。以下にその方法をメモ。

 

ソースコード

アップロード

受信側

do{
    if( $_FILES['music']['size'] < 1 ) break; //ファイルサイズチェック
    if( $_FILES['music']['error'] != 0 ) break; //エラーチェック
    if( $_FILES['music']['type'] != 'audio/mpeg' ) break; //mp3かどうかチェック

    $path = './file/';
    $file = date('YmdHis') . '.mp3';

    if( !move_uploaded_file($_FILES['music']["tmp_name"], $path . $file) ) break; //アップロード

    $flg = true;
}while(0);

送信側

<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" enctype="multipart/form-data">
    <input type="file" name="music"><br>
    <input type="submit" value="submit">
</form>

再生

<audio id="audio" controls>
    <source src="test.mp3">
</audio>

<input type="button" value="play" onclick="audio_play()">
<input type="button" value="pause" onclick="audio_pause()">

<script type="text/javascript">
function audio_play() {
    audio.play();
}
function audio_pause() {
    audio.pause();
}
</script>

 - PHP HTML

  関連記事

formのinput=
formのinput="file"でディレクトリを選択させ、ディレクトリ内のファイルを全てアップロードする方法

フォームで複数のファイルをアップロードしたい場合、input="file"を複数 ...

HTML5のカレンダーピッカーについて(input type=
HTML5のカレンダーピッカーについて(input type="date")

とあるシステムのフォーム部分を改修する案件があった為、内容を確認していると日付入 ...

formでdisplay:none;にしてても送信される
formでdisplay:none;にしてても送信される

formで特定の部分をdisplay:none;で非表示にしてても 内容は送信さ ...

同一フォーム内でクリックするボタンによって送信先を変更する方法
同一フォーム内でクリックするボタンによって送信先を変更する方法

同一フォーム内で「登録する」ボタンと「プレビュー」ボタンを用意し、「登録する」を ...

HTMLのimgタグでブラウザ幅によって異なる画像を表示する方法
HTMLのimgタグでブラウザ幅によって異なる画像を表示する方法

あるサイトのコーディングデータを貰った際に1つのimgタグに対して複数の画像が指 ...