このページの本文へ

PROGRAMMING 古籏一浩のJavaScriptラボ第86回

Android 4の新機能でカメラWebアプリ作ってみた

2012年04月04日 10時01分更新

古籏一浩

  • この記事をはてなブックマークに追加
本文印刷
js-labo

 Android OSの最新バージョン「Android 4」ではさまざまな新機能が追加され、標準のWebブラウザーも大幅に機能強化されました。中でも注目は、W3Cが標準化を進めている「Media Capture API」のサポートです。

 従来、カメラやマイクなどのデバイス固有の機能をWebで利用するには、PhoneGapなどのモバイルフレームワークの力を借りる必要がありましたが、Androdi 4ではHTMLとJavaScriptだけで利用できます(*1)。Media Capture APIを利用することで、カメラやマイクなどを利用したWebアプリケーションを手軽に作成できるのです。

 今回は、Android 4を搭載したスマートフォン「Galaxy Nexus」向けに、カメラで撮影した画像を取り込んで加工するWebアプリケーションを作成してみましょう。

【図】fig1.png
Galaxy Nexus。最新のAndroid 4を搭載している


*1 Android 3(タブレット)でもHTML Media Captureに対応しているので、ブラウザーからカメラなどを呼び出して撮影はできますが、JavaScriptによる後処理ができません。また、Android 2.x用のOpera Mobileブラウザーでもカメラから取り込みに対応しています。今回のサンプルはChrome for Androidでも動作します。

Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

Webディレクター江口明日香が行く