27

Facebook がデスクトップ用の HTML5 通知を使い始めたことに気づき、ブログの楽しみのためにそれに手を出そうと思いました。私のアイデアは非常に単純です。新しいブログが公開され、apache cronjob が X 分ごとに実行され、ファイルが呼び出され、PHP ウィザードが実行され、通知が送信されます。

私はオンラインでnode.js と angularを使用した例を見つけましたが、どちらも使い慣れていないので、PHP に固執したいと思います。

これが私のプロセスです: ユーザーは私のブログに行き、ボタンをクリックして通知を許可します。簡潔にするために、以下のコードは、ユーザーが「通知」ボタンをクリックしたときに通知を送信します。これは完全に機能し、理論的には、将来の通知にサブスクライブする必要があります。

if ('Notification' in window) {

function notifyUser() {
    var title = 'example title';
    var options = {
        body: 'example body',
        icon: 'example icon'
    };

    if (Notification.permission === "granted") {
        var notification = new Notification(title, options);
    } else if (Notification.permission !== 'denied') {
        Notification.requestPermission(function (permission) {
            if (permission === "granted") {
                var notification = new Notification(title, options);
            }
        });
    }

}

$('#notify').click(function() {
    notifyUser();
    return false;
});

} else {
    //not happening
}

上記のフィドルを見ることができます。

ユーザーへのアクセスが許可され、いつでも通知を送信できるようになりました。素晴らしい！次に、XYZ という ID を持つブログ エントリを作成します。私の cron ジョブは、上記の node.js の例をテンプレートとして使用して、次の PHP スクリプトを呼び出します。

(この例では、電話から手動でスクリプトを呼び出し、デスクトップ画面を見ているだけです。デスクトップは同じドメインに「サブスクライブ」されているため、次のように動作する/動作するはずです。)

$num = $_GET['num'];

$db = mysql_connect(DB_HOST, DB_USER, DB_PASS);
if($db) {
    mysql_select_db('mydb', $db);
    $select = "SELECT alert FROM blog WHERE id = ".$num." && alert = 0 LIMIT 1";
    $results = mysql_query($select) or die(mysql_error());
    $output = '';
    while($row = mysql_fetch_object($results)) { 

        $output .= "<script>

        var title = 'new blog!';
        var options = {
            body: 'come read my new blog!',
            icon: 'same icon as before or maybe a new one!'
        };

        var notification = new Notification(title, options);

        </script>";

      $update = "UPDATE blog SET alert = 1 WHERE id = ".$num." && alert = 0 LIMIT 1";
      mysql_query($update) or die(mysql_error());

    }

    echo $output;

}

次に、データベースとブログ エントリをチェックします。XYZ の「アラート」は現在「1」に設定されていますが、デスクトップ ブラウザには通知がありません。私のブラウザは、通知を送信しているのと同じ URL に登録されているので、メッセージが表示されると思います。

私が何か間違ったことをしている (おそらく PHP はこれに適した言語ではないのでしょうか?) か、仕様を誤解しています。誰かが私を正しい方向に向けるのを手伝ってもらえますか? 私は何かが欠けていると思います。

どうもありがとう。

更新 1

コメントによると、これを含むスクリプトを呼び出すと、次のようになります。

 var title = 'new blog!';
 var options = {
    body: 'come read my new blog!',
    icon: 'same icon as before or maybe a new one!'
 };

  var notification = new Notification(title, options);

私の通知を購読しているすべてのデバイスにヒットするはずです。電話でこれを試しましたが、デスクトップにはまだ通知がありません。通知が 1 つのデバイスに固定されているように見え、ブラウザーでページが開いていなくても通知を送信する Facebook とは対照的に、ページの読み込み時またはクリック時にのみ呼び出すことができるため、まだ何かが足りないと思います。

4

1 に答える 1

17

あなたの問題は、Javascript と PHP を接続するための AJAX がないことです。PHP スクリプトが機能する方法は、スクリプトを手動で実行することです。そのため、そのスクリプトをヒットしたデバイスだけが通知を受け取ります。現在、その情報を他のデバイスに実際に送信するものはありません。

問題をより適切に説明すると、デスクトップで通知へのアクセスが許可されている可能性がありますが、これらの通知は自動的に取り込まれません。あなたが提供したコードは、cron ジョブとして使用するのではなく、AJAX を使用してスクリプト URL にアクセスする必要があります。

まず、更新された通知があるかどうかを確認するために、PHP スクリプトへの繰り返し要求を開始する必要があります。新しい通知がある場合は、返された応答を使用して新しい通知オブジェクトを作成する必要があります。

次に、通知スクリプトではなく、JSON 文字列を出力するように PHP スクリプトを変更する必要があります。

JSON 出力例:

{
  {
    title: 'new blog!',
    options: {
      body: 'come read my new blog!',
      icon: 'same icon as before or maybe a new one!'
    }
  },
  {
    title: 'another blog item!',
    options: {
      body: 'come read my second blog!',
      icon: 'hooray for icons!'
    }
  }
}

ハードコーディングする代わりにandを引数としてnotifyUsers()取る必要があります:titleoption

function notifyUser(title, options) { ... }

jQuery を使用して、PHP 応答を取得し、通知を作成します。

function checkNotifications(){
  $.get( "/path/to/script.php", function( data ) {
    // data is the returned response, let's parse the JSON string
    json = JSON.parse(data);

    // check if any items were returned
    if(!$.isEmptyObject(json)){
      // send each item to the notify function
      for(var i in json){
        notifyUser(json[i].title, json[i].options);
      }
    }
  });

  setTimeout(checkNotifications, 60000); // call once per minute
}

あとは、AJAX ポーリングを開始するだけなので、これを Web ページに追加します。

$(document).ready(checkNotifications);

それだけです！デスクトップが通知を取り込む必要があるときに、その部分が欠けていました。ただし、注意してください。これはテストされていないため、何かを微調整する必要がある場合があります。

于 2016-01-06T20:16:01.240 に答える