古籏一浩のJavaScriptラボ ― 第73回

JavaScriptで作れるiPhone用ボイスレコーダー

2011年10月12日 11時00分更新

古籏一浩

ツイートする

　HTMLやCSS、JavaScriptでスマートフォンアプリを開発できるフレームワーク「PhoneGap」。PhoneGapでは、通常のWebアプリでは実現できない、スマートフォンならではの機能を使ったアプリも作れます。今回は、iPhone用のボイスレコーダーアプリを作ってみましょう。

　PhoneGapで音声を録音するには、W3Cで仕様策定中のCapture APIと、Phone Gap独自のMedia APIの2つの方法があります。Capture APIを使うと専用のUIに切り替わりるので、JavaScriptでは録音と再生しか処理できません。一方、Media APIでは、通常のWebページの中に録音・再生機能を埋め込んでアプリを作れます（ただし、現行バージョンではまれに録音が途切れることがあります）。今回は、Media APIを採用します。

　なお、録音処理はiOSシミュレーターでは動作しませんので、必ず実機を接続して動作を確認する必要があります。本サンプルでは一度録音したファイルを削除していないので、何度も録音を繰り返すとストレージの空き容量を圧迫します。録音データを削除したい場合は、iPhone/iPadに入れた本アプリを一度削除してください。

録音もMedia APIで

　Media APIは前回、音楽を再生するのに使用したAPIです。

Media API: http://docs.phonegap.com/phonegap_media_media.md.html

　Media APIは音楽を再生するだけでなく、録音もできます。ただし、Android OSとiOSでは以下のように使用するメソッドが異なります。

	Androidの場合	iOSの場合
録音開始	startRecord()	startAuidoRecord()
録音終了	stopRecord()	stopAuidoRecord()

　PhoneGap 1.1.0のドキュメントでは、iOSの場合、「あらかじめ録音するファイルが存在しなければならない」とありますが、実際に試してみると、ファイルを用意しなくても、new Media()で正しいパス＋ファイル名でオブジェクトを生成すると録音できます。

　また、PhoneGapに関する解説ページで、navigator.notification.activityStart()やnavigator.notification.activityStop()が記述されている場合がありますが、これらのメソッドはすでに廃止予定になっており、0.9.6以降では書かなくても動作します（下位互換性のため、このメソッドを記述しても動作には影響ないようです）。

前へ 1 2 3 4 5 次へ