HTML5プロフェッショナル認定試験レベル1 例題解説

例題解説とその内容については、例題提供者の監修です。内容や試験問題に関わるお問い合わせにつきましては、LPI-Japan事務局ではお応えできませんのでご了承ください。
例題解説のご提供者さまを募集中です。LPI-Japan事務局までぜひご投稿ください。選ばれた方の例題解説は本サイトに掲載させていただきます。
※修正等により、例題番号が連番ではない場合がございます。あらかじめご了承ください。

1.5 APIの基礎知識

例題5.16「1.5.2 デバイスアクセス系API概要」「1.5.4 通信系API概要」
レベル1の出題範囲「1.5.2 デバイスアクセス系API概要」「1.5.4 通信系API概要」からの出題です。
フロントエンド(HTML5)で利用できる決済関連の標準APIは次のうちどれか。
  • FeliCa API
  • NFC API
  • Payment Request API
  • Proximity API

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。
例題公開日:2018年12月4日

答えはこちら

答え C

近年、生活に現金の必要性が少なくなってきました。ネットショッピングはもちろん、店頭での買い物、電車に乗るにも電子マネーやスマホで決済ができます。この利便性はビジネスを成長させるため、xx Pay などを含む、より簡単で安全な決済のためのAPIも同時に提供されています。

例題の選択肢は下記のとおりです。

A:日本国内の交通系の電子マネーでは、NFC(近接通信)の一種であり日本国内仕様であるFeliCaが使用されています。FeliCaの国内仕様のための HTML5 で使用する FeliCa API は存在しません。なので不正解です。
B:Web NFC API というHTML5で使用できるAPIが存在しますが、W3C標準ではなく利用にも制限があります。また、NFC API は存在しません。なので不正解です。
C:Payment Request APIはHTML5で利用できる決済に関するAPIで、標準の専用UIが提供され、発送先、クレジットカードなどの情報の選択、そして実行後、承認のリクエストを決済代行業者に送信して、承認を得られたら最終的に決済まで完了するためのAPIです。決済自体は代行業者が行うことに注意してください。したがってこれが正解です。
D:Proximity API はHTML5で利用できるAPIでモバイルデバイスの接近センサーのイベントを処理し、NFCと似ていますが、決済とは関係ないので不正解です。

出題範囲の詳細(1.5.2 デバイスアクセス系API概要)
出題範囲の詳細(1.5.4 通信系API概要)

LPI-Japan
中谷 徹

例題5.15「1.5.1 マルチメディア・グラフィックス系API概要」
レベル1の出題範囲「1.5.1 マルチメディア・グラフィックス系API概要」からの出題です。
著作権を保護する目的の技術・仕様は次のうちどれか。2つ選びなさい。
  • Media Source Extensions - MSE
  • Digital Rights Management - DRM
  • Encrypted Media Extensions - EME
  • HTTP Live Streaming - HLS
  • MPEG-DASH (Dynamic Adaptive Streaming over HTTP)

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。
例題公開日:2018年9月4日

答えはこちら

答え B、C

インターネットの発展で音楽、映像、書籍などがブラウザで容易に利用できるようになりました。それに伴いディジタルコンテンツの著作権を守る仕組みが必要になりました。

DRM(ディジタル著作権管理)は、特定のソフトウェアまたはハードウェアでのみ再生可能にする技術です。
Apple のiTunes Storeに実装された FairPlayなどが知られています。

HLSとMPEG-DASHは HTML5で規定されたプラグインを必要としないStreaming形式で、著作権の保護技術は含まれません。

MSEはストリーミング再生のための技術で、著作権の保護技術は含まれません。HLSとMPEG-DASHの形式を利用できます。

EMEはMSEに基づいた仕様で、ブラウザとDRM対応ソフトウェアの間の通信経路を提供します。これにより、HLSとMPEG-DASHの著作権もDRMで保護して配信できるようになります。

したがって、正解は BのDRMとCのEMEになります。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.13「1.5.2 デバイスアクセス系API概要」
レベル1の出題範囲「1.5.2 デバイスアクセス系API概要」からの出題です。
利用者の寝返り振動を利用した目覚ましスマホアプリを開発したい。
HTML標準で利用できる寝返り感知のためのAPIは次のうちどれか。2つ選びなさい。
なお、スマホは枕元に置いて使用するものとする。
  • DeviceMotion Event(加速度センサー)
  • DeviceOrientation Event(ジャイロセンサー)
  • GeoLocation API(位置情報取得)
  • Proximity API(近接センサー)
  • Vibration API(バイブレーション)

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え A、B

通常、目覚まし時計は指定した時刻にアラームを鳴らす機能と、アラームを止めて寝過ごすことが無いようスヌーズ機能が備わっています。しかしアラームが鳴っても寝ぼけたままスヌーズ機能も解除してしまい寝過ごした経験をお持ちの方も少なくないのではないでしょうか。
最近のスマホの目覚まし時計アプリはスグレモノで、指定した時刻帯で眠りの浅い瞬間にアラームを鳴らすようになっています。その眠りの浅い瞬間を拾うタイミングは、レム睡眠、ノンレム睡眠の周期などではなく、寝返りだそうです。
スマホの加速度センサーやジャイロセンサーにより寝返りの振動を拾うことで眠りが浅くなった時にアラームを鳴らすことができ、快適な目覚めになります。それでも…という方は、複数のアプリをセットして下さい。

Aの加速度センサーはX,Y,Zの3軸方向の加速度を振動として devicemotion イベントで検知できるので、正解です。
Bのジャイロセンサーは角速度センサーとも呼ばれ、X,Y,Zの3軸方向の角加速度を振動として deviceorientation イベントで検知できるので、正解です。
CのGeoLocation APIは位置情報を取得するAPIで、スマホではGPS、PCではIPアドレスなどからおおよその位置情報を取得できますが、寝返りを検知できるほどの精度ではないので不正解です。
Dの近接センサーは赤外線で距離を検知します。通常、通話のため顔を近づけたことを検知し画面を暗くしたり、タッチパネルの誤動作を防ぐために使用されるもので、不正解です。
EのバイブレーションAPIは振動を感知するためのものではなくスマホを振動させるためのAPIなので、不正解です。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.12「1.5.3 オフライン・ストレージ系API概要」
レベル1の出題範囲「1.5.3 オフライン・ストレージ系API概要」からの出題です。
HTMLページにファイル送信機能を盛り込みたい。有効なAPIを3つ選びなさい。
  • Drag and Drop API
  • File API
  • FTP API
  • Progress Events
  • SCP API

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え A、B、D
ファイルの送信を行うアプリでは、送信ファイルの選択、送信の開始、送信状況(進捗・完了)の通知が必要です。

選択肢BのFile APIは、<input type=file multiple>によるファイル選択ダイアログで取得したファイルを JavaScriptで処理するAPIです。
選択肢AのDrag and Drop APIは、ファイルをドラッグ&ドロップするAPIで、状況によりファイル選択ダイアログより使用しやすくなります。
選択肢DのProgress Eventsは、プログレスバーを表示する際の各種イベント処理のAPIです。ファイルが大きい、通信速度が遅いなど、転送時間が長い場合に有効です。
選択肢CのFTP API、選択肢EのSCP APIはHTML標準のAPIとしては存在ないので不正解です。
FTP(File Transfer Protocol)は、古くからあるファイル転送のプロトコルで広く使用されていましたが、現在はセキュアな通信の必要性から SCP/SFTP が利用されるようになっています。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.11「1.5 APIの基礎知識」
レベル1の出題範囲「1.5 APIの基礎知識」からの出題です。
スマートフォン利用者の所在地に従って、他のアプリの実行中であっても、雷雨情報を通知できる雷雨アラートWEBアプリを開発したい。利用を検討すべき API を2つ選びなさい。
  • WebRTC
  • DeviceOrientation Event
  • Geolocation API
  • Message API
  • Notifications API

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え C、E
開発に必要な機能は、所在地情報取得と通知です。所在地情報の取得は Geolocation API(C)、通知には Notifications API(E) で実現できます。
Aの WebRTC は、ブラウザでWeb会議を実現するAPIで、音声および動画のリアルタイム通信の他、チャットやファイル共有の機能を利用できますが、このアプリには必要ありません。Bの DeviceOrientation Event は、デバイスの方向や傾きなどの情報を取得するAPIですが、位置そのものは取得できません。Dの Message API は Androidアプリ開発環境にはあるようですが、HTML標準にはありません。
実際に開発するには、これらの他、Web Workers または Service Workers, Push API, fetch の併用が必要になるでしょう。
また、付加機能として Vibration API で通知の際にスマホを振動させたりすることも可能でしょう。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.10「1.5.1 マルチメディア・グラフィックス系API概要」
レベル1の出題範囲「1.5.1 マルチメディア・グラフィックス系API概要」からの出題です。
SVG の説明として適切なのは次のうちどれか。
  • 文字や図形の装飾や変形は CSS で指定する必要がある。
  • HTML では img 要素でのみ指定できる。
  • ラスター形式のため拡大してもきれいに表示できる。
  • XML形式のためテキストエディタで作成・編集できる。
  • 写真などのデータは扱えない。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え D
SVG(Scalable Vector Graphics)はベクター形式のグラフィックスをXMLで表現する仕様です。
グラフィックスにはラスター形式とベクター形式があります。円を描く場合、ラスター形式では方眼紙の目を塗りつぶして円を表現するのに対し、ベクター形式では白紙にコンパスで円を表現するといった描画の違いがあります。この違いにより、方眼紙状の液晶画面を最終出力先とした場合、画質に差が生じます。
例えば、アイコン用に作成したグラフィックスを高解像度の液晶画面に拡大して表示する際、ラスター形式は作成したドット表現を虫眼鏡で拡大したイメージとなりギザギザが増幅されますが、ベクター形式では高解像度の画面上に新たにコンパスで円を描くので高精細できれいな円を表示できます。
また、CSSと同様にSVG単体で文字や図形の作成、装飾や変形が可能な上、CSSでの装飾も可能です。 利用例として、ロゴやアイコンを1つのSVGでまかなうことができ、レスポンシブデザインにも有効です。また、円グラフや棒グラフなど、さまざまな形式のチャート表現にも利用されています。

各選択肢の解釈は下記のとおりです。
A. SVG は単独で装飾や変形によるアニメーションが可能なので、不正解です。
B. svg は png等と同様 img 要素での指定とインラインでの使用が可能なので、不正解です。
C. SVGはベクター形式なので、不正解です。
D. SVGはXMLで表記しテキストエディタで編集できるので、正解です。
E. pngなどの画像をsvgに変換するツールを利用したり、svgのimage要素でpngなどを取り込むことが出来るため写真などのデータも利用できるので、不正解です。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.9「1.5.3 オフラインストレージ系 API 概要」
レベル1の出題範囲「1.5.3 オフラインストレージ系 API 概要」からの出題です。
楽しみながら学習できる子供向けアプリを開発したいが、どうしても時間のかかる処理がある。子供に敬遠されないよう、その処理をバックグラウンドで処理し、画面上は別の操作を進められるようにしたい。実現するためのAPIは次のうちどれか。2つ選びなさい。
  • Service Workers
  • Background Tasks
  • Web Workers
  • Multiple Threads
  • Nomad Workers

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え A、C
A. Service Workers と C. Web Workers は JavaScriptで処理をバックグラウンドで実行できるAPIです。
C. Web Workers は、複数の処理をWorkerという単位で並列処理することができるため、計算処理や大きなファイルアクセスなど時間のかかる処理をバックグランドで実行し、アプリのユーザビリティを向上できます。
A. Service Workers は、Application Cacheに代わるオフライン処理のAPIですが、Push API, fetch を 併用して、バックグラウンド処理と同期して同様の処理を実現します。
選択肢B、DのようなAPIはありません。
E. Nomad Workers は、インターネットやモバイルデバイスの進化により増加した、働く場所を特定しない人たちの事です。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.8「1.5.1 マルチメディア・グラフィックス系API概要」
レベル1の出題範囲「1.5.1 マルチメディア・グラフィックス系API概要」からの出題です。
動画の配信に、HLS、MPEG-DASHなどを Media Source Extensions(MSE) APIで呼び出すストリーミング配信技術が主流となっているが、そのメリットは次のうちどれか。3つ選びなさい。
  • 動画全体のダウンロードの完了待たずに動画再生が開始可能である。
  • ブラウザのみで再生でき、専用プラグインをインストールする必要がない。
  • ライブストリーミング配信動画でも、いつでも最初から視聴できる。
  • ブラウザ標準対応のストリーミング技術を利用すると動画が高画質に再生できる。
  • ブラウザ側にファイルとして残らないため、著作権の保護の観点でも有利である。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

正解 A、B、E
HTML標準で使用できるストリーミング技術であるHLS(HTTP Live Streaming), MPEG-DASH(DASH: Dynamic Adaptive Streaming over HTTP)は Media Source Extensions(MSE) といった技術を使用することで、従来のようなファイルのダウンロードを待たずに動画の再生を開始でき、利用者側にファイルとして残さないためセキュアでもあります。
また、HTTPサーバーのみで配信でき、ブラウザのみで再生できる点が主流となる理由です。ライブ配信の動画は配信時間を過ぎれば視聴できません。また、動画の画質はプロトコルに依存しないため、CとDは不正解です。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.7「1.5.2 デバイスアクセス系 API 概要」
レベル1の出題範囲「1.5.2 デバイスアクセス系 API 概要」からの出題です。
次のデバイスアクセス系のAPIの内、デバイス付近の照度を取得するものは次のうちどれか。
  • Geolocation API
  • Device Light API
  • Ambient Light Event
  • Device Orientation Event
  • Screen Luminos API

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

正解 C
Ambient Light Event は、デバイス付近の照度(光量レベル)を取得するAPIで、カーナビのようなアプリで夜間やトンネル内で輝度を落とすなどの機能をもたせたい場合などに使用できます。
A.のGeolocation APIは、位置情報を取得するAPIなので、不正解です。
B.のようなAPIはありません。不正解です。
D.のDevice Orientation Eventは、加速度センサーから得られる、デバイスの向き、傾き、移動時の加速度などを取得できます。
E.はスクリーンの輝度と言う意味ですが、このようなAPIはありません。不正解です。

出題範囲の詳細

LPI-Japan
中谷 徹

例題5.6「1.5.2 デバイスアクセス系 API 概要」
レベル1の出題範囲「1.5.2 デバイスアクセス系 API 概要」からの出題です。
Geolocation API の説明として正しいものは次のうちどれか。正しいものをすべて選びなさい。
  • GPS機能のないデスクトップPCでは位置情報を取得できない。
  • インターネットに接続していれば、必ず位置情報を取得できる。
  • 取得した位置情報の精度は、APIからは判断できない。
  • 緯度と経度の他に、方角と速度も取得できる。
  • 取得できる位置情報は緯度と経度のみで、高度は取得できない。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

正解 D
Geolocation API では、GPS、WiFi、IPアドレス、基地局などからデバイスの位置情報を、緯度、経度、高度及びそれらの誤差、方角、速度で取得できます。
したがって、AとCとEは間違いです。Bは、インターネットに接続していれば、位置情報を取得するためのリソースはありますが、デバイスの利用者が位置情報の取得を許可していない場合には取得できません。位置情報はプライバシーに関わる情報であるため、一般に利用者によって拒否できるようになっています。

出題範囲の詳細

LPI-Japan
中谷 徹

メルマガ登録E-mail Magazine

受験を決めたら、まずメルマガ登録。
学習に役立つ例題解説付きメールマガジンを定期発行

氏名

ご提供いただく個人情報の取り扱いについて

ご提供いただいた情報につきましては、当団体内において管理し第三者には開示いたしません。 ご提供いただいた情報につきましては、当団体のオープンソース普及/促進活動のための統計データに反映し、Linux技術者認定事業サービスの充実に活用させて頂くとともに、当団体からの最新情報やイベント情報のご案内を差上げる目的に利用させていただきます。 当団体のプライバシーポリシーについてはこちらをご参照ください。