ブラウザプッシュ通知と携帯などのプッシュ通知は別物なんですか？

Question

ブラウザプッシュ通知の場合バックグラウンドで動かせない、
これは正しい認識でいいでしょうか？
下記のようなブラウザプッシュ通知はどんな使い道があるんですか？

下記は実行したブラウザ(ドメイン)を開いていないと、通知できない
ブラウザを開いてなくても通知できるのがプッシュ通知だと思っていました
大間違いでしょうか？

<button onclick="notifyMe()" style="width:300px;height:300px">Notify me!</button>

<script>
function notifyMe() {
let promise = Notification.requestPermission();
  if (!("Notification" in window)) {
    alert("This browser does not support desktop notification");
  }

  else if (Notification.permission === "granted") {
    var notification = new Notification("Hi there!");
  }


  else if (Notification.permission !== "denied") {
    Notification.requestPermission().then(function (permission) {
      if (permission === "granted") {
        var notification = new Notification("Hi there!");
      }
    });
  }
}
</script>

Answer 1

質問者さんが触ってみた Notification は、通知を表示するためだけのAPIであり、「プッシュ通知」ではありません。

プッシュを行うためにはPush APIを利用する必要があります。

Push API (含 Service Worker) と Notification API を組み合わせれば、スマートフォンアプリの様にアプリが前面になくても通知を出すことが可能になります。

Service Worker やサーバサイドの仕組みも必要になるため、試すだけでも簡単ではない印象です。

Comments

[rtya]

Notificationは、検索したら、プッシュ通知として紹介してるサイトが多かったので、騙されました

[退会済みユーザー]

> rtya さん
現時点でついている回答は、2件とも「質問の前提がおかしいです」という回答です。
とてもベストアンサーを選べるような状況ではないはずですが、何をもってベストアンサーとしたのでしょうか？
個人的にこの質問は気になるものなので、適切にクローズしてほしいところです。

Answer 2

ブラウザプッシュ通知の場合バックグラウンドで動かせない、

これは正しい認識でいいでしょうか？

間違っています。

Comments

[maisumakun]

なお、iOS Safariはプッシュ通知に非対応ですので、モバイル環境で利用可能なのはAndroidに限られます。

[rtya]

Androidもプッシュ通知許可しても何も届かないんですが、設定がおかしいだけでしょうか？

[maisumakun]

コードの書き方が悪いのではないかと思います。

（というか、基本的にプッシュ通知は「ブラウザJavaScript内から」行うものではないです。ブラウザ内の処理はブラウザを開いていないと行えませんので、「いつでも送信できる」プッシュ通知のメリットを活かすことができません）

[rtya]

＞というか、プッシュ通知は「ブラウザJavaScript内から」行うものではないです

どういうことですか？
詳しく教えてください

プッシュ通知は「ブラウザJavaScript内から」行うものではない　なら、
なぜJavaScriptで存在してるんですか？

[rtya]

＞ブラウザ内の処理はブラウザを開いていないと行えませんので、「いつでも送信できる」プッシュ通知のメリットを活かすことができません）

JavaScriptのプッシュ通知は使い道がない、ってことでいいですか？

[maisumakun]

> プッシュ通知は「ブラウザJavaScript内から」行うものではない　なら、
なぜJavaScriptで存在してるんですか？

プッシュ通知の受信設定はJavaScriptから行いますが、実際の送信は（実用的には）他の手段を使います。

[rtya]

JavaScript→ブラウザを開いていれば他のタブを開いていても通知が届く（PC）
その他→メール配信サービスのようにブラウザを開いていなくても届く

[maisumakun]

> JavaScript→ブラウザを開いていれば他のタブを開いていても通知が届く（PC）

違います。ブラウザを開かなくても届くように、JavaScriptで「セット」することは可能です。

[maisumakun]

> JavaScriptのプッシュ通知は使い道がない、ってことでいいですか？

ブラウザJavaScriptから「送信する」のでは、「ブラウザを開いてなくても通知できる」というメリットを享受することはできない、というだけです。

[rtya]

私が出したコードはセットはされるが、送受信は違うということですか？

[rtya]

どうしたら望んでる通知が実現できますか？
JavaScript単体では無理ってことですか？

[maisumakun]

> どうしたら望んでる通知が実現できますか？

希望は「とりあえず通知が動くのを見たい」ということですか？それとも、「ブラウザを止めていても通知を表示したい」ということですか？

[maisumakun]

> 私が出したコードはセットはされるが、送受信は違うということですか？

Promiseを受け取っていないので、セットだけで考えたとしても正しく動作していない状況です。

（あと、プッシュ通知を正しく動作させるには、HTTPS環境が必須ですが、それは用意していますか？）

[rtya]

ブラウザを開かずに通知メッセージを表示させることです

[rtya]

公式のコードです
私が手を加えたものではありません。
正しく動作していないなんてあるんですか？

[maisumakun]

> ブラウザを開かずに通知メッセージを表示させることです

でしたら、ブラウザ内JavaScript「だけ」では実現できません。サーバサイドから送信を行う必要があります。

[maisumakun]

> 公式のコードです
私が手を加えたものではありません。

どこにありましたか？（本当に「公式」ナノカが疑問です）

[rtya]

PHPからできるんですか？

[rtya]

https://developer.mozilla.org/en-US/docs/Web/API/Notification
です

[maisumakun]

let promise = Notification.requestPermission();なんて行は、元のコードにはないです。

[rtya]

サーバーサイドから送る実例があれば教えて下さい

[rtya]

let promise = Notification.requestPermission();は通知を許可するかどうかの確認を出すものです
それを付けなければ動かせません

[maisumakun]

> それを付けなければ動かせません

先頭にあるのはおかしいです（元のコードでも、必要条件をチェックしてからrequestPermissionを行っています）。

HTTPS環境で実行していますか？

[rtya]

HTTPS環境ですよ？
それがあろうがなかろうが　一体何が変わるんですか？

[maisumakun]

ブラウザは何を使っていますか？

[rtya]

最後に書くべきでした

[rtya]

Firefoxです
通知は届きますよ
ブラウザを開いていれば、ですが。

開いてなくて届くやり方が聞きたいんですが

[rtya]

というか、絶対無理ですよね？
new Notification("Hi there!");
これはブラウザを開いてないと実行できないし。
公式でも無理じゃないですか。

[maisumakun]

> 通知は届きますよ
ブラウザを開いていれば、ですが。

そうだったのですね、失礼しました。

[rtya]

ですので
私の言う認識であってますか

JavaScript→ブラウザを開いていれば他のタブを開いていても通知が届く（PC）
その他→メール配信サービスのようにブラウザを開いていなくても届く

[maisumakun]

> これはブラウザを開いてないと実行できないし。

いえ、ブラウザを実行していなくても実行されるJavaScriptとして「Service Worker」があります。

[maisumakun]

https://developers.google.com/web/fundamentals/codelabs/push-notifications?hl=ja

[rtya]

ブラウザプッシュ通知はサーバー側からのタイミング送れない！
任意のタイミング送れない、どういう利用価値があるのか意味不明！

[maisumakun]

> ブラウザプッシュ通知はサーバー側からのタイミング送れない！

そんなことはありません。

[rtya]

Service Workerの簡略化がNotification - Web APIだと思ってたんですが違いますか？

[rtya]

＞サーバー側からのタイミング送れない！
＞そんなことはありません。

じゃ、どうやるのか教えてもらえませんか？

[maisumakun]

> Service Workerの簡略化がNotification - Web APIだと思ってたんですが違いますか？

違います。

[rtya]

↑後だしでしょ！ずるいよ！

＞質問者さんが触ってみた Notification は、通知を表示するためだけのAPIであり、「プッシュ通知」ではありません。

こんな指摘しましたか？

[rtya]

一緒だと思ってたんでしょう！答えてください。

[maisumakun]

> 一緒だと思ってたんでしょう！答えてください。

質問も「ブラウザプッシュ通知」としていたので、その枠組で回答していました。

[rtya]

そうですか、残念ですがベストアンサーはあげられません
ご了承ください

[maisumakun]

> 残念ですがベストアンサーはあげられません

別に求めてもいません。

[rtya]

その捨てセリフはなんなんですか？
やめてください

[maisumakun]

> その捨てセリフはなんなんですか？
やめてください

返信をしただけです。

[rtya]

求めてないんじゃなくて、自分が知らなかっただけでしょ？
ちゃんと受け止めてもらえませんか？
お願いします、ゴールドユーザーの価値が下がります

[maisumakun]

> 求めてないんじゃなくて、自分が知らなかっただけでしょ？

その2つは両立するかと思います。実際、回答中に新たな知見が得られることも、そう珍しくはないです。

[maisumakun]

> ちゃんと受け止めてもらえませんか？

「rtyaさんが求める形のもの」を提供できる自信はないです。