2023年3月にリリースされたiOS16.4からiPhone safariにもWEBプッシュを配信できるようになりました。

iOSにWEBプッシュを配信するためには、ウェブサイトをPWAにする必要があります。PUSHCODEを導入することで、WEBプッシュの導入と併せてウェブサイトをPWAにすることが可能です。

このマニュアルでは、ウェブサイトのPWAにし、iOSにWEBプッシュを配信する方法について説明します。

PWAについての説明とメリットはこちらの記事をご参照ください。

実際にPUSHCODE管理画面で、サイトをPWA化してiOSにWEBプッシュを配信する手順について説明します。

サイト設定画面で、PWAを導入するのサイトの【iOS配信設定(任意)】ボタンをクリックします。

iPhone SafariにWebプッシュ通知を配信するためには、ウェブサイトをPWAにする必要があります。PWA対応の設定を行いましょう。

スマートフォンのホーム画面に表示されるアプリ名を入力します。アプリ名は半角12文字以内が推奨されています。半角12文字を超えると一部省略されることがあります。

PWAをインストールする際に、ホーム画面に表示するアイコン画像を設定します。

アイコン画像は512×512サイズのPNGファイルを推奨します。

画像はドメイン配下の任意のパスに設置してください。

画像を設置したURLを入力し、【このホームアイコンURLを登録する】をクリックします。

※ホームアイコンのURLは次のステップのマニフェストファイルに記載されます。URLを変更した場合は、マニフェストファイルをダウンロードして再設置してください。

PWAを導入するために必要なファイル「manifest.json」をダウンロードして、サーバーに設置します。

【manifest.jsonをダウンロード】をクリックしてダウンロードしたmanifest.jsonを、pushcode_sw.jsと同じバスに配置していください。
​

manifest.jsonのリンクタグ

コードをコピーし、HTMLソースの</head>タグの直前に追加してください。

こちらのタグは、Google Tag Managerでの追加ができないため、HTMLに直接記載してください。

最後に、こちらの手順に従ってPWAでプッシュ通知を受け取ってみましょう。

以上で、iOSデバイスにもWEBプッシュ通知を配信できるようになりました。今後もPUSHCODEをご活用いただき、ユーザーとの円滑なコミュニケーションを築いていただけることを心より願っております。引き続き、お客様のビジネス発展の一助となるよう、サポートに努めてまいります。どうぞ宜しくお願い申し上げます。

​