PHPを使用してシンプルな音楽プレーヤーを実装する方法-PHPチュートリアル-php.cn

PHPを使用してシンプルな音楽プレーヤーを実装する方法

PHPz

リリース： 2023-09-26 14:38:02

オリジナル

1011 人が閲覧しました

PHPを使用してシンプルな音楽プレーヤーを実装する方法

PHP を使用して単純な音楽プレーヤーを実装する方法

はじめに:
音楽プレーヤーは、オーディオファイルを再生および管理できる一般的な Web アプリケーションです。この記事では、PHP 言語といくつかのオープンソースライブラリを使用して単純な音楽プレーヤーを実装する方法を学びます。この記事の学習を通じて、読者はオーディオファイルを処理する方法、シンプルなプレーヤーインターフェイスを作成する方法、オーディオの再生と制御を実装する方法を学びます。

準備
始める前に、いくつかの基本的なリソースを準備する必要があります。

PHP 環境: PHP がインストールされていて、PHP プログラムをローカルで実行できることを確認してください。
オーディオファイル: MP3 形式またはその他の一般的な形式のオーディオファイルをいくつか準備します。
オープンソースライブラリ: jPlayer と呼ばれるオープンソースライブラリを使用します。これは、強力で柔軟性があり、互換性のある HTML5 オーディオプレーヤーです。最新バージョンは jPlayer 公式 Web サイトからダウンロードできます。

基本的な HTML 構造の作成
jPlayer を使用する前に、プレーヤーの基本的な HTML 構造を作成する必要があります。簡単な例を次に示します。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>音乐播放器</title>
</head>
<body>
  <audio id="myAudio" src=""></audio>
  <button onclick="play()">播放</button>
  <button onclick="pause()">暂停</button>
  <button onclick="stop()">停止</button>
</body>
</html>

ログイン後にコピー

上の例では、オーディオファイルを再生するための audio 要素を作成しました。また、プレーヤーの再生、一時停止、停止機能を制御するためのボタンもいくつか追加しました。

jPlayer ライブラリの導入
次のステップでは、jPlayer ライブラリをプロジェクトに導入する必要があります。 jPlayer のコードをダウンロードまたは取得した後、それを解凍し、必要なファイルをプロジェクトディレクトリにコピーします。

次に、jPlayer の CSS および JS ファイルを HTML ページに導入します。次のコードをタグに追加します:

<link rel="stylesheet" type="text/css" href="path/to/jplayer.css">
<script type="text/javascript" src="path/to/jplayer.js"></script>

ログイン後にコピー

path/to/jplayer.css と path/to/jplayer.js## が設定されていることを確認してください。正しくは#パスです。

プレーヤーでは、オーディオファイルのアップロード、追加、削除を処理する必要があります。ここでは、単純なアップロードフォームを使用して音声ファイルをアップロードします。

<form action="upload.php" method="POST" enctype="multipart/form-data">
  <input type="file" name="file">
  <input type="submit" value="上传">
</form>

ログイン後にコピー

上記のフォームでは、ファイル入力ボックスと送信ボタンが作成されます。ユーザーが音声ファイルを選択してフォームを送信すると、アップロードされたファイル情報が処理のために

upload.php スクリプトに送信されます。

次に、アップロードされたオーディオファイルを処理するための

upload.php スクリプトを作成する必要があります。簡単な例を次に示します:

<?php
  if(isset($_FILES['file'])){
    $file = $_FILES['file'];
    $targetDir = "uploads/";
    $targetFile = $targetDir . basename($file['name']);
    move_uploaded_file($file['tmp_name'], $targetFile);
  }
?>

ログイン後にコピー

上記の例では、最初にファイルがアップロードされているかどうかを確認します。次に、アップロードされたファイルの一時パスを指定された宛先パスに移動します。

次に、PHP を使用してオーディオファイルの再生と制御を実装する必要があります。簡単な例を次に示します。

<?php
  $audioFiles = glob("uploads/*.mp3");
  if(isset($_GET['file'])){
    $selectedFile = $_GET['file'];
    echo '<audio id="myAudio" src="'.$selectedFile.'"></audio>';
  }else{
    $selectedFile = $audioFiles[0];
    echo '<audio id="myAudio" src="'.$selectedFile.'"></audio>';
  }
?>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>音乐播放器</title>
  <link rel="stylesheet" type="text/css" href="path/to/jplayer.css">
  <script type="text/javascript" src="path/to/jplayer.js"></script>
  <script type="text/javascript">
    function play(){
      $("#myAudio").jPlayer("play");
    }
    function pause(){
      $("#myAudio").jPlayer("pause");
    }
    function stop(){
      $("#myAudio").jPlayer("stop");
    }
  </script>
</head>
<body>
  <div class="playlist">
    <?php foreach($audioFiles as $file): ?>
        <a href="?file=<?php echo $file ?>"><?php echo basename($file) ?></a><br>
    <?php endforeach; ?>
  </div>
  <button onclick="play()">播放</button>
  <button onclick="pause()">暂停</button>
  <button onclick="stop()">停止</button>
</body>
</html>

ログイン後にコピー

ここまでで、簡単な音楽プレーヤーの作成が完了しました。このプレーヤーは、オーディオファイルのアップロード、プレイリストの表示、オーディオファイルの再生、一時停止、停止を行うことができます。

以上がPHPを使用してシンプルな音楽プレーヤーを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。