PHP 経由でシンプルなオンラインオーディオプレーヤーを作成する方法-PHPチュートリアル-php.cn

PHP 経由でシンプルなオンラインオーディオプレーヤーを作成する方法

WBOY

リリース： 2023-09-24 08:54:02

オリジナル

905 人が閲覧しました

PHP 経由でシンプルなオンラインオーディオプレーヤーを作成する方法

PHP を使用してシンプルなオンラインオーディオプレーヤーを作成する方法

今日のインターネット時代では、オーディオリソースの配布と共有がますます便利になっています。オンラインオーディオプレーヤーは非常に実用的で楽しいプロジェクトになります。この記事では、PHP を使用してシンプルなオンラインオーディオプレーヤーを作成する方法を紹介し、具体的なコード例を示します。

オンラインオーディオプレーヤーを実装するには、次の要素が必要です:

インターフェイスレイアウト: オーディオプレーヤーの表示に使用されるインターフェイス、
オーディオリソース管理:オーディオファイルをサーバーにアップロードして管理します。
再生コントローラー: 再生、一時停止、音量調整などの操作に使用します。
オーディオの進行状況をリアルタイムで更新します。

まず、オーディオプレーヤーを表示するためのインターフェイスレイアウトが必要です。 HTML ファイル (例: player.html) を作成し、次のコードを追加します。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Online Audio Player</title>
</head>
<body>
    <h1>Online Audio Player</h1>
    <audio id="audioPlayer" controls>
        <source src="audio.mp3" type="audio/mpeg">
    </audio>
</body>
</html>

ログイン後にコピー

上記のコードでは、<audio> タグを使用しています。オーディオプレーヤーを作成し、src 属性を audio.mp3 として指定します。このパスは実際の状況に応じて変更できます。ブラウザで player.html を開くと、基本的なオーディオプレーヤーインターフェイスが表示されます。

次に、オーディオリソース管理機能を実装する必要があります。 upload.php などの PHP ファイルを作成し、次のコードを追加します。

<?php
if($_FILES["audio"]["error"] == UPLOAD_ERR_OK) {
    $target_dir = "uploads/";
    $target_file = $target_dir . basename($_FILES["audio"]["name"]);
    if(move_uploaded_file($_FILES["audio"]["tmp_name"], $target_file)) {
        echo "上传成功！";
    } else {
        echo "上传失败！";
    }
}
?>

ログイン後にコピー

上記のコードでは、$_FILES を通じてユーザーがアップロードした音声を受信します。 可変ドキュメント。まずファイルのアップロードが成功したかどうかを確認し、成功した場合は指定したディレクトリ（例ではuploads/）にファイルを移動し、最後に該当する情報を出力します。

次に、再生コントローラーの機能を実装する必要があります。 player.html ファイルのコードを変更し、<script> タグを追加し、その中に次のコードを追加します。

<script>
    var audioPlayer = document.getElementById("audioPlayer");
    audioPlayer.onplay = function() {
        console.log("音频播放中...");
    }
    audioPlayer.onpause = function() {
        console.log("音频暂停。");
    }
    audioPlayer.onvolumechange = function() {
        console.log("音量变化：" + audioPlayer.volume);
    }
</script>

ログイン後にコピー

上記のコードでは、 getElementById メソッドはオーディオプレーヤーのオブジェクトを取得し、オーディオの再生、一時停止、音量変更時に対応する情報を出力するいくつかのイベントリスナーを追加します。

最後に、オーディオの進行状況をリアルタイムで更新する必要があります。 player.html ファイルのコードを変更し、<script> タグを追加し、その中に次のコードを追加します。

<script>
    var audioPlayer = document.getElementById("audioPlayer");
    audioPlayer.ontimeupdate = function() {
        var currentTime = audioPlayer.currentTime;
        var duration = audioPlayer.duration;
        console.log("当前时间：" + currentTime + "，总时长：" + duration);
    }
</script>

ログイン後にコピー

上記のコードでは、 ontimeupdate イベントを渡して現在の再生時間と合計時間をリアルタイムで更新し、対応する情報を出力します。

これまでに、シンプルなオンラインオーディオプレーヤーを実装しました。これらのファイルをローカルまたはサーバーに展開してテストできます。オーディオファイルのアップロード、再生コントロール、音量調整、リアルタイムのオーディオ進行状況の更新などの機能を備えた、完全なオンラインオーディオプレーヤーを入手できます。

概要:
この記事では、インターフェイスレイアウト、オーディオリソース管理、再生コントローラー、オーディオの進行状況やその他の機能のリアルタイム更新を含む、PHP を使用したシンプルなオンラインオーディオプレーヤーの作成方法を紹介します。上記のコード例を使用して、独自のオーディオプレーヤーの作成を開始し、実際のニーズに合わせてその機能を拡張できます。この記事があなたのお役に立てば幸いです。また、プログラミングが楽しくなることを願っています。

以上がPHP 経由でシンプルなオンラインオーディオプレーヤーを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。