[レベル: 上級]

PWA (Progressive Web Apps: プログレッシブ ウェブ アプリ) に対応したサイトをアプリと同等に扱えるようになったことを、先日記事にしました。

この最新の試験的機能は、Android版Chromeの Canary と Dev で利用可能でした。
つづいて、Chrome Beta でも利用可能になりました。

正式版への導入も近づいているように思われます。

Chromeのチャンネル

まず、予備知識としてChromeの”チャンネル”について簡単に説明します。

Android版Chromeには、その開発の進み具体に応じて4つのバージョンが存在します。
バージョンは”チャンネル”とも呼ばれます。

  • Canary ―― Canaryは最も先に進んでいるチャンネルです。テストされていない機能が即座に実装されます。毎日バージョンアップします。
  • Dev ―― Devには、ある程度Canaryで検証された機能が実装されます。とはいえ、試験的な機能ではあるので開発者向けのチャンネルになります。
  • Beta ―― Betaでは、最新の機能を利用できます。正式版の一歩手前の位置付けで、新しい機能をいち早く試したい上級ユーザー向けのチャンネルです。ちなみに僕はBetaを使っています。
  • Stable ―― Stableは安定版、つまり正式版のチャンネルです。十分にテストされた機能が実装されます。一般的なユーザーはこのChromeを使っているでしょう。

今回、PWAサイトのアプリ化をサポートしたのは Beta です。

Chrome Beta でのウェブ アプリ インストール

2月2日に投稿されたChromium Blogでの公式アナウンスでは、間もなく Beta がPWAサイトのアプリ化をサポートするとのことでしたが、最新のバージョンではすでにサポートしています。

Chrome Beta でのウェブアプリのインストールの流れを見てみましょう。
Canary/Devとほぼ同じです。

まず、機能を有効にします。
まだ試験機能なので、デフォルトでは無効になっています。

次のURLにアクセスし、「ホーム画面に追加(改訂版)」機能を有効にします。

chrome://flags/#enable-improved-a2hs

「ホーム画面に追加(改訂版)」機能を有効にする

変更を反映させるために設定後はChromeを再起動します。

あわせて、セキュリティ設定で「提供元不明のアプリ」の有効化も必要です。
「Chrome Canary と Chrome Dev の場合……」と説明には書いてありますが、Betaにも当てはまります。

設定を有効にしたら、PWAに対応したサイトにアクセスし、メニューから「ウェブアプリをインストール」を選択します。
CanaryやDevでは以前からの「ホーム画面に追加」でしたが、「ウェブアプリをインストール」にメニュー名が変わっています。
単なるホームスクリーンへのアイコン追加ではなくなったからです。

ウェブアプリをインストール

名前を付けます。

ウェブアプリのインストール

インストールが進みます。

ウェブアプリのインストール

ウェブアプリのインストール

ウェブアプリのインストール

ウェブアプリのインストール

インストールが完了すると、ホームスクリーンにアイコンが自動的に追加されます。

ホームスクリーンにアイコン追加

アプリとして登録されたので、アプリドロワーに出てきました。

アプリドロワーにPWAサイトが登録

アプリとしての設定も可能です。

PWAサイトをアプリとして設定

PWAサイトをアプリとして設定

プッシュ通知やストレージ管理、バージョンアップなどアプリと同等のことをPWAサイトで実行可能になります。
もやはウェブサイトではなくアプリなので、Chromeには依存しません。

起動中アプリの一覧でも、Chromeとは別に表示されます。

独立したアプリとして認識

PWAサイトのアプリ化は、Betaチャンネルでもデフォルトでは無効になっている試験機能です。
今後デフォルトで有効になり、正式版であるStableチャンネルにも移植されるのではないでしょうか。

Googleはかなり本気でPWAに力を入れているように僕は感じています。
小さなサイトではPWAは恩恵を感じづらい仕組みですが、一定規模以上であれば今後の動きにぜひ注目してほしいと思います。

もしあなたが、僕のブログの更新記事を毎日スマホで見ているなら、Chrome Betaをインストールしてアプリとして僕のブログを利用してみてはいかがでしょうか?(Betaでも、不安定なことを僕は経験したことが一度もないので安心して使えるはずです)。
PWAといっても、Serice Workerが動いているだけでホームスクリーンアイコン追加くらいしか実装できていないのですが、プッシュ通知あたりは(ウザくならないようにw)実装したいと考えています。

このエントリーが役に立ったらシェアしてください

[Ads & Featured Contrents]

海外SEO情報ブログTOPモバイルSEO › GoogleはPWAに本気? Android版Chrome Betaもウェブアプリのインストールをサポート開始

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


▲ページの一番上に戻る