はじめに
突然ですが、、、、
アプリケーションにメッセージのポップアップ通知機能を実装することになりました。
実装したい機能のイメージはこんな感じです。
(Gigazine様の記事から引用させていただきました。)
画像引用元:Google ChromeがMac OS Xでネイティブ・プッシュ通知に対応
Google Chrome
使ってると出てくるアレです。
嫌いな人が多いのではないでしょうか。
通知自体を切ってる人が結構多いイメージです。
今回はそんな嫌われ者のこいつを実装したいので早速方法を調査しました!
実装
ネットの海を調べていくとWebPush
という方法を発見!
WebPush API
なるものを用いて、ブラウザに対してサーバからプッシュ通知が可能な技術とのこと。
参考記事:WebPushについて簡単整理
.....というわけで以下の記事を参考にプッシュ通知機能の実装を始めました!
## 開発環境
|環境|バージョン|
|:-----------|------------:|:------------:|
| Mac OS X | Catalina 10.15.6|
|Google Chrome | 92
| PHP | 7.3
| Laravel | 6.2
| Docker | 20.10.7
Docker imageはphp:7.3-apache
を使用しました。
php:7.3-apache
実装中、エラーに遭遇!
記事の内容に従い、5.4のService Worker
本体まで作成し、「イベントのプッシュ通知を登録する」をクリックしました。
問題なく登録完了と表示されました。
続いて、全ユーザーにプッシュ通知を送信するため、テスト用のルーティングを追加しページへアクセスしました。
(以下のコードは今回参考にさせていただいた、効果的!Laravelでブラウザにプッシュ通知する機能の目次6
から引用させていただきました。)
~省略~
Route::get('web_push_test', function(){
$users = \App\User::all();
\Notification::send($users, new \App\Notifications\EventAdded());
});
~省略~
すると..........
以下のエラーに遭遇!
WebPush gmp extension is not loaded but is required for sending push notifications with payload . You can fix this in your php.ini
エラー内容を確認するとWebPushを利用するためには、gmp
というPHPの拡張モジュールのインストールが必要らしい。
一応公式にもインストール方法があったのだが、これだけだとどうも動かない。
# apt-get install libgmp-dev
その後も別のインストール方法を試したり、PHP.iniの内容を修正してみたもののうまくいかず.....
色々調べてみるとGitHub issueに参考にできそうな内容を発見!
コンテナ内で以下のコマンドを実行し、gmp
をインストールし、Apache
の再起動でモジュールの有効化ができそう!
# apt-get install libgmp-dev
# docker-php-ext-install gmp
# apachectl restart
参考記事:[Bookmarks is missing php-gmp ]
(https://github.com/nextcloud/docker/issues/854)
ただ、毎回コンテナにコマンドを打ってインストール&有効化をするのはめんどくさいので、
Dockerfile
にgmp
導入のための内容を追記し、gmp
のインストール&有効化ができるようにしました。
FROM php:7.3-apache
~ 省略 ~
RUN apt-get update && \
apt-get -y install libgmp-dev && \
docker-php-ext-install gmp \
~省略~
あらかじめDockerfileに記述しておけば、わざわざコンテナ内でコマンド打ったりしなくて済むので便利ですね。
ちなみにここでのdocker-php-ext-install
はPHP標準搭載の拡張パッケージのインストールと有効化ができるようです。
参考記事:[【PHP】peclとは何か?pecl install と docker-php-ext-installの違い]
(https://qiita.com/shizen-shin/items/0d6a9cbeb16047c7d47a#pecl-install%E3%81%A8docker-php-ext-install%E3%81%AE%E9%81%95%E3%81%84)
コンテナ立ち上げ後、
念のために以下のコマンドを実行して、コンテナ内にgmp
モジュールが追加されているか確認してみると、
# php -m | less
⬇︎
[PHP Modules]
~省略~
fileinfo
filter
ftp
gmp ⬅️発見!!!! 確かにインストールされています。
hash
iconv
~省略~
しっかりできている様子!
さて、次はいよいよ動作確認です!
動作確認
gmp
が無事コンテナ内にインストールできていたので、早速先ほどのテスト用URIへアクセス!
プッシュ通知が送信され、画面の右上にポップアップメッセージとして表示されました!
機能自体の実装は完了です! やったね!
最後に
思った以上にハマってしまった箇所ではありましたが、最終的に解決できて良かったです!
トライ&エラーを経て、Dockerへの理解も深まりつつあるので、個人的にはかなり良い経験だったと思います。
ちなみに任意でプッシュ通知を送信できるように、php artisanコマンド
を作成し、ポップアップメッセージを表示することもできます。
以下の記事を参考にコマンドの作成から実装まで簡単にできます。
ネットの海には有益な情報が沢山溢れていて、本当に助かるなあとしみじみ思いました。
(しかもほとんどが無料で読み放題です。)
私も誰かにとって有益な情報を発信できるように頑張っていきたいと思います。
おしまい