前回のあらすじ
Google driveをコマンド一発で呼び出せると良いのでPWAアプリのコマンド化を行いました
Google driveがPWAじゃなくない？
どうやらそのようですね？
ではPWAにしてしまいましょう！
野良PWA化
どうやって？
普通に考えると人様のサービスを勝手に変更はできません
なので自分のドメインでPWAのサイトを作ります
あとはそこからGoogle driveにリダイレクトします
ね、簡単でしょ？
コード
以下に野良PWA用のコードを用意しました
https://github.com/m-m-n/nora-pwa
使い方
以下を用意します
- サーバー
- ドメイン
- 証明書
Webサーバーの設定等は省略します
/path/to/nora-pwa に配置したとします
cd /path/to/nora-pwa/scripts
vim sites/drive.google.com.json
以下のようなJSONファイルを用意します
{
"domain": "drive.google.com",
"redirect_to": "https://drive.google.com/",
"site_name": "Google ドライブ",
"short_name": "ドライブ",
"icons": [{
"file_name": "icon.png",
"sizes": "192x192",
"type": "image/png"
}],
"theme_color": "#1a73e8",
"background_color": "#ffffff"
}
./generater.php sites/drive.google.com.json
これで /path/to/nora-pwa/public にGoogle driveをPWA化するためのディレクトリーが生成されます
cd /path/to/nora-pwa/public/drive.google.com
ls
index.html manifest.json redirect.html sw.js
アプリのアイコンが無いので適当に生成してサーバーにアップロードします
ls
icon.png index.html manifest.json redirect.html sw.js
アクセスする
準備が整ったのでアクセスしてみましょう
https://YOUR-DOMAIN/drive.google.com/index.html を開くとPWAのインストールが促されるかと思います
促されない場合はGoogle Chromeの右上にある三点のメニューアイコンをクリックし、インストールします
インストールの項目がない場合はmanifest.json、service workerあたりが存在しているか確認します
manifest.jsonを確認するとPWAとして起動した初期URLではindex.htmlではなくredirect.htmlとなっています
redirect.htmlで本来のGoogle driveのサイトへジャンプするようになっているので、勝手に作ったPWAアプリがあたかもGoogle driveのように見えます
厳密には別ドメインに遷移してるので、遷移先のURL(この場合 https://drive.google.com )が表示されますが、それを承知でやっているので問題ないでしょう
これでPWAとしてインストールが出来たので、前回の手順でコマンド化することが出来るようになりました
嬉しい副産物
スマホでアプリがリリースされていないサービスも勝手にPWA化してインストールできる！！！！
それでは良いPWAライフを。