Open14

PWA の Web Push を調査してみる

Ryo ShindoRyo Shindo

調査したいこと

  • 実装して試したいこと
    • プッシュ通知
      • ユーザが許可する必要のある項目
      • 以下状況で挙動に差分が生まれるか
        • アプリを開いているとき
        • アプリを閉じているとき
        • アプリを完全に終了しているとき
        • デバイスをスリープさせているとき
    • ホーム画面にアイコンを配置したときの挙動
      • ブラウザが開くが、アドレスバーが表示されないという噂
      • そのアプリから別のページに遷移するとかはできる?
      • ホーム画面にアイコンを配置するときの UX
    • オフライン時の挙動はオンライン時と異なることがある?

リンク

Ryo ShindoRyo Shindo

デバイス・OS 等の要件

  • iOS 16.4 +
    • 2023/03 リリース(ちょっと新しめ)
  • Android はわりかし昔からサポートしているらしい

SaaS

参考になりそうなリンク集

Ryo ShindoRyo Shindo

送信した通知の効果を追跡するみたいなテクがあるらしい。どういう運用体制にすれば良いんだろう

Ryo ShindoRyo Shindo

FCM のような SaaS を使用しなくても push 通知を送信することはできるが、

  • クロスプラットフォーム
  • 最新版の追随

は結構厳しそうに思えるから自前実装するのではなくて、SaaS を使用するのが良い?web push の場合はそのあたりをブラウザが吸収してくれるものと思っていたが違う?

とりあえず実装概要が記載された記事を見つけたのでこれをなぞって実装してみたい

https://zenn.dev/chocoyama/articles/5b07eead5ae0aa

Ryo ShindoRyo Shindo

ruby で実装するのであればこのあたりが参考になるかなあ

  • https://github.com/pushpad/web-push
  • https://zenn.dev/yudukikun5120/articles/10b637c96be381
    • 通知内容はジョブで管理すれば良いから、notifications テーブルは不要そう
    • 通知の開封とかのトラッキングは FCM とか使ったほうが良かったりする?
      • FCM を使用しないことによるツラみがイマイチ伝わってきていないかもしれない。おそらく自分の理解不足で、さっさと実装しろという話ではある
Ryo ShindoRyo Shindo

ブラウザで通知を表示するには、

  • OS の設定でブラウザ自体の通知を許可
  • ブラウザでドメインに対して通知を許可

する必要がある。ちょっと UX 的にしんどいか・・?

あと、Apple 製 OS だと例えば 睡眠 がオンになっていると通知が抑制されるなど細かい落とし穴がありそう

Ryo ShindoRyo Shindo

とりあえずいろんな記事を参考にしながら設定や実装を進めていたら

Uncaught (in promise) DOMException: Registration failed - missing applicationServerKey, and gcm_sender_id not found in manifest

というエラーが出た

どうやら gcm_sender_id が必須なのは古いブラウザに対応する必要があるときのみみたいなので、ひとまずこちらの設定をすればよいのかなという印象

https://qiita.com/tomoyukilabs/items/9346eb44b5a48b294762

Ryo ShindoRyo Shindo

雑感

  • iOS 等で「ホーム画面に追加」をユーザに行わせるのはハードルが高い?
  • URL バーで遷移ができないので、画面上ですべての画面遷移を行わせる必要がありそう