私は現在、ユーザーが音声メモを録音して自分のアカウントに保存できるテストサイトを作成しようとしています。 PHPまたはJavaScriptのいずれかを使用してこれを行うための最良の方法は何ですか?
このプロセスのために私が探しているステップは次のとおりです。
1)ユーザーが録音ボタンをクリックします。 2)記録シーケンスの開始。 3)シーケンスを停止します。 4)ファイルに名前を付けてサーバーに送信します。
私の主なクエリは2番目のステップに焦点を当てています。ここでは、音声を録音するためにユーザーのマイクと対話するメカニズムが必要です。私はまだWeb開発自体に不慣れであり、JavaScriptを使用して音声録音を呼び出す方法がわかりません。
Googleで検索したところ、StackOverflowで同様の問題に対処するリンクがいくつか見つかりましたが、回答は役に立ちませんでした。多くの解決策がFlashを指していますが、私はそれをできるだけ避けたいと思います。だから私の質問は、「JavaScriptを使用して音声を録音することは可能ですか?はいの場合、どのように?」に要約されます。
前もって感謝します。
HTML5オーディオAPIはブラウザで広くサポートされていません。Chromeで動作すると思います。Firefoxでは最近ナイトリーに追加されました...この段階ではブラウザプレフィックスが必要ですが、一般的なAPIは...
navigator.getUserMedia({audio: true}, function(stream) { /* do stuff */ });
つまり、Chromeの場合はwebkitGetUserMedia
、Firefoxの場合はmozGetUserMedia
になります。
現在のより一貫性のあるオプションは、FlashやJavaなどのブラウザプラグインを使用するか、ユーザーがインストールする必要のあるデスクトップクライアントを作成することです。
GetUserMediaに関する関心のあるリソース:
次の質問がさらに役立つ場合があります。
フラッシュまたはJavaサーブレットを使用してブラウザからサーバーにマイクデータをアップロードするためのチュートリアル?
ローカルMediaStreamをScriptProcessingNodeに接続するオーディオグラフを作成することにより、マイクから録音できるようになりました。
navigator.webkitGetUserMedia({video: true, audio: true}, function(stream) {
var audioContext = new webkitAudioContext,
mediaStreamSource = context.createMediaStreamSource(stream),
processor = context.createJavaScriptNode(4096, 2, 2);
processor.onaudioprocess = function(e) {
// Process the audio data found in e.inputBuffer
};
mediaStreamSource.connect(processor);
processor.connect(context.destination);
});
(Chromeベンダープレフィックスを使用)
これをWebsocketまたはプレーンXHRに接続して、チャンクをサーバーに送信し、サーバーで処理してオーディオファイルにすることができます。各チャネルをから変換する必要があります
公称範囲が-1-> + 1の非インターリーブIEEE32ビットリニアPCM
お好みのフォーマットに。
オーディオを録音し、wavファイルにエンコードし、(すべてクライアント側で)保存する同様の例は、次の場所にあります。
https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC
AudioContextの詳細:
HTML5オーディオ録音が到着するまでは、Flashとモバイルデバイスでのファイルアップロードを組み合わせたソリューションを組み合わせる必要があります。モバイルデバイスでは、ファイルアップロード画面には通常オーディオまたはビデオレコーダーがあるため、ユーザーはデバイスから直接録音できます。
デバイスのファイルアップロードにオーディオレコーダーがない場合は、ビデオレコーダーを使用してから、サーバーでビデオをMP3に変換する必要があります。それが recordmp3online.com でそれを行う方法です。