ChromeでWEBからデスクトップへプッシュ通知をブロック、オンとオフ、実装方法は簡単？

Windows版のChromeを使っていて、ブラウザで特定のURLを開くと、右下にプッシュ通知が出てくることありませんか？

あれがウザいって思ったので解除、止める方法、実装方法について調べてみました。

Chromeプッシュ通知とは

プッシュ通知とは、スマホのアプリやパソコンのソフトなどで、システム側がユーザーにメッセージを表示したり音を出したりして、通知する機能です。

Windowsで表示されるプッシュ通知は、こんな奴ですね。

プッシュ通知の逆は、プル通知またはフェッチ通知です。

ユーザーがアプリを開いたり、送受信ができるボタンを押したり、ブラウザで特定のURLを開いて何らかの操作をすることで情報を受けとることです。

Chromeでプッシュ通知が消えない？ウィルスか？

Chromeの通知は左下に表示されますが、消えてくれないっていう声も聞きます。

基本的にプッシュ通知は、通知をクリックすれば画面からは消えるはずです。

Chromeプッシュ通知ブロック、オフ設定 (Windows, Android)

プッシュ通知がウザいって思うのは、私だけでしょうか？

そんな時は、Chromeの通知設定でブロックします。

すべてのサイトからの通知を許可またはブロックする手順は次の通りです。

Chromeの通知設定

↓以下をChromeのURLに記述してください。

サイトURLを一つずつブロックすることも可能ですが、全部をブロックすることも可能です。

AndroidでChromeのプッシュ通知をブロックする

すべてのサイトからの通知を許可またはブロックする

1. Android スマートフォンまたはタブレットで Chrome アプリ Chrome を開きます。
2. アドレスバーの右側で、その他アイコン その他 次へ [設定] の順にタップします。
3. [サイトの設定] 次へ [通知] の順にタップします。
4. 上部で設定のオンとオフを切り替えます。

一部のサイトからの通知を許可またはブロックする

1. Android スマートフォンまたはタブレットで Chrome アプリ Chrome を開きます。
2. 通知を表示しないようにするサイトを開きます。
3. アドレスバーの右側で、その他アイコン その他 次へ 情報 情報 の順にタップします。
4. [サイトの設定] 次へ [通知] の順にタップします。
   この設定が表示されない場合、このウェブサイトからは通知を表示できないようになっています。
5. [許可] または [ブロック] を選択します。

Windows 10でChromeの通知音を消したい

Windows 10でデスクトップの通知音を消したい、という場合があると思います。

アプリごとにオフにする方法は次の通りです。

設定画面を開く

「スタートボタン」をクリックして、左下の「設定」を開きます。

次に「システム>通知と操作」を開きます。

アプリごとに通知のON/OFFを管理する

設定画面下段に「次のアプリからの通知を表示する」という項目があります。

幾つかのアプリが表示されています。

それぞれ、すぐ横のオン・オフボタンで、通知自体の有効・無効を変更できます。

通知音だけを切る

ここで、表示されているソフト名がクリックできます。

• 「通知」
• 「通知バナーを表示」
• 「通知が届いたら音を鳴らす」

という３つの詳細設定が表示されます。

ここで、「通知が届いたら音を鳴らす」を「オフ」にすることで、そのアプリの通知音を切ることができます。

通知音設定はソフトの個別設定画面ではなく、Windows 10 の設定

通知音の設定は、ソフトの設定の中を探すのがポイントです。

この方法で設定可能なのは、一部のアプリのみで、ここで設定できないアプリは、通知音が出てしまいます。

これでも通知音が出る場合は、「サウンド設定」から、すべての通知音を消すしか方法がありません。

Chrome Webプッシュ通知 実装 (Windows, Android)

Chromeを使ったWebのプッシュ通知の実装方法は簡単です。

以下の記事に分かりやすいサンプルが載っていました。

Webサイトからプッシュ通知を送ろう！ JavaScriptでのプッシュ通知の実装方法
https://ics.media/entry/11763

このサンプルを実行するには、curlが動く環境が必要です。

私のようにWindowsパソコンを使っている場合は、Windows版のcurlを使うとよいでしょう。

curlの公式サイト
https://curl.haxx.se/download.html

Windows版のcurlの使い方
https://qiita.com/sugasaki/items/ba9737d13db33d2cd71f

Chrome デスクトップ通知 表示されない、出ない？

上記のデスクトップ通知のサンプルを使っても、プッシュ通知が表示されない場合は、Chromeのプッシュ通知の設定でブロックされていないか確認してみてください。

Chromeの通知設定

↓以下をChromeのURLに記述してください。

また、お使いのChromeが

• Service Worker
• PushManager

をサポートしている必要があります。

ServiceWorkerの確認

↓以下をChromeのURLに記述してください。