Service Workerを活用
まるでネイティブアプリなWebサイト「プログレッシブWebアプリ」実装のヒント（1/2 ページ）
ネイティブアプリケーションのような操作性を有する「プログレッシブWebアプリケーション」。その実装方法を取り上げる。
これまでモバイルデバイスからクラウドアプリケーションへアクセスしてきたのは、Webブラウザか専用のクライアントアプリケーション（ネイティブアプリケーション）だった。Webページの処理をバックグラウンドで支えるスクリプト「Service Worker」、キャッシュの機能強化、新しいインストールオプションなど、新しいWebブラウザ機能の登場により、開発者はWebブラウザベースのアプリケーションとネイティブアプリケーションそれぞれの機能を融合する「プログレッシブWebアプリケーション」を作成できるようになった。米国で開催されたWeb開発者向けイベント「O'Reilly Fluent Conference」で、不動産サービス会社Settledの最高技術責任者（CTO）ディーン・ヒューム氏は、この新しいスタイルのアプリケーションを実装するヒントを紹介した。
Settledは英国で不動産情報の掲載サービスを提供する。同社はプログレッシブWebアプリケーションを使用して、顧客向けに新しいダッシュボードを構築することを考えていた。このダッシュボードにより、ユーザーはネットワークに接続しているかどうかに関係なく、迅速かつ容易に同社の情報へアクセスできるようになる。このプログレッシブWebアプリケーションを実装してからというもの、SettledのユーザーはWebサイトの閲覧に2倍の時間を費やすようになり、Webサイトの約15分の1のデータを利用するようになった。その上、ページの読み込み時間は3分の1に短縮した。
これまでのネイティブアプリケーションの大きなメリットは、ユーザーがアイコンをクリックすることで起動できる点にある。プログレッシブWebアプリケーションは、ページに含まれるマニフェストファイル（アプリケーションの実行に必要な情報を記載したファイル）を利用して同じ機能を実現する。マニフェストファイルは144×144画素のアイコンを含み、このアイコンをユーザーのホーム画面にインストールできる。Webページ自体は、HTTPS接続経由で実行するService Workerを使用する必要がある。ユーザーがアプリケーションへのリンクをインストールするオプションを得るには、少なくとも2回はWebサイトへアクセスしなければならない。
併せて読みたいお薦めの記事
ネイティブアプリとWebアプリに関する解説
- 「ネイティブアプリ」と「Webアプリ」、モバイルアプリはどれが使いやすい？
- スマホで使いたいのはやっぱりネイティブアプリ、「モバイルの常識」はどう変化？
- モバイルアプリで知っておきたいHTML5の「完全無欠ではない」ポイント
ユーザー企業によるアプリケーション開発
プログレッシブWebアプリケーションを支えるService Worker
Service Workerは、アプリケーションロジックをバックグラウンドで処理する。つまり開発者はクライアントの表示、アプリケーションロジック、クラウドとのバックエンド通信を分離することができる。「Service Workerは、Webブラウザの能力を解き放つ鍵になる」とヒューム氏は話す。「Webブラウザからの要求の取り出しと、サーバへの要求をバックグランドで実行する」（同氏）。Service Workerがヘッダを検査し、ヘッダを操作してからサーバへ送信するか、フロントエンドの要求であれば直接応答する。
現状ではService Workerは、全ての最新Webブラウザに搭載されているか、搭載が計画されている。ただしAppleの「Safari」にはまだ実装されていない。同社の経験によると、ユーザーの75％がService WorkerをサポートするWebブラウザから同社のサイトへアクセスしていたという。プログレッシブWebアプリケーションを構築する場合、ヒューム氏は「Service Worker Toolbox」（SW Toolbox）の利用を勧めている。SW Toolboxは、Service Workerを実装するための多種多様なコードスニペット（断片的なサンプルコード）を含んでいる。
要求を直接操作できるService Workerの機能は、新たなセキュリティの脆弱（ぜいじゃく）性をもたらす可能性がある。ハッカーは理論上、Service Workerを使用して、銀行口座に意図しない要求をする中間者攻撃を仕掛けることができる。そのためService WorkerはSSLを使用して、クライアントとバックエンドサーバ間のデータを暗号化し、セキュリティを確保する必要がある。ヒューム氏によれば、Cloudflareの「CFSSL」やオープンソースの「Let's Encrypt」などの無料ツールを使えば、開発者はSSLを非常に簡単に実装できるという。
Copyright © ITmedia, Inc. All Rights Reserved.
この記事の著者
関連記事
新着ホワイトペーパー PR
-
製品資料
[株式会社MatrixFlow] 「物流リソース最適化」ガイド：人員・配車・傭車を出庫依頼の確定前に決めきる -
製品資料
[株式会社キーエンス] なぜRPA導入は頓挫する？ シナリオ作成の壁を乗り越える解決策とは -
製品資料
[株式会社セールスフォース・ジャパン] 「CRMは設計と無関係」は本当か？ PLMとの融合で実現する高速開発 -
事例
[日本ヒューレット・パッカード合同会社] AIエージェントの時代にどう備える？ 「新たな働き手」を支える3要素とは -
製品資料
[日本ヒューレット・パッカード合同会社] “横並びの自動化”から脱却、AI活用で生産性と競争力を高める秘訣
こんなメディアも見られています
TechTargetジャパンに関連する情報をお探しであれば、こちらのメディアもお役に立てるかもしれません。
ベンダーコンテンツ PR
From Informa TechTarget
SpecialPR
アクセスランキング
-
1
なぜ「全社配布Copilot」は使われないのか？ 失敗に学ぶAI定着
-
2
法務と開発者で「言葉が通じない」問題 トヨタやソニーが語るOSS管理の真実
-
3
なぜ「Gemini 4 Argon」は出遅れたのか？ Googleが狙う“逆転のシナリオ”
-
4
損保ジャパンはなぜ「COBOL」を捨てなかったのか？ 脱メインフレームの真相
-
5
情シスの約8割が転職や退職を意識 調査で分かった“辞めたくなる最大の理由”
-
6
ChatGPTは“検索しまくり”でGeminiは“淡泊”？ データが明かすAIの裏側
-
7
情報漏えいはなぜ繰り返されるのか 今すぐ見直すべき「境界」
-
8
「Wi-Fi 7」経由でWindowsが乗っ取られる？ 最高権限奪取の恐怖
-
9
「結局使わなくなる」Microsoft 365 Copilotを半年で定着 キリンの3施策
-
10
「中堅・中小企業のネットワーク・セキュリティ運用実態」に関するアンケート
ホワイトペーパーランキング PR
-
1
不審メールの経路や見せ方に変化？ 2026年夏の3事例から見えた動向と対処方法
-
2
家庭用Wi-Fiルーターの業務利用は危険？ 避けるべき理由と具体的な対策
-
3
Microsoft 365を安全に運用 うっかりミスやサイバー攻撃に備えるデータ保護術
-
4
財務部門がAIを最大限に活用する方法 無駄のない戦略的リーダーシップへの道
-
5
LLMが兵器化？ 元FBI高官が鳴らす警鐘とセキュリティツール統合のポイント
-
6
「オンプレミス回帰」せざるを得ない“合理的な理由”
-
7
なぜRPA導入は頓挫する？ シナリオ作成の壁を乗り越える解決策とは
-
8
生成AIを開発に導入しても効果が見えない？ 実証実験で分かった成果と課題
-
9
経産省DX指針から読み解く、受発注業務デジタル化ロードマップ
-
10
HDDを使わない「SSDオンリー」が無謀なのはなぜ？
TechTargetジャパン SNS
@techtarget_itmをフォロー
インフォメーション
注目情報をチェック
TechTargetジャパンをフォロー