Ajaxをブラウザを開いている限り無限ループしたい

Question

$(document).ready(function()
{

    /**
     * Ajax通信メソッド
     * @param type      : HTTP通信の種類
     * @param url       : リクエスト送信先のURL
     * @param dataType  : データの種類
     */
    $.ajax({
        type: "POST",
        url: "json.php",
        dataType: "text",
        /**
         * Ajax通信が成功した場合に呼び出されるメソッド
         */
        success: function(data, dataType) 
        
        {
        
            //結果が0件の場合
            if(data == null) alert('データが0件でした');
            
            //返ってきたデータの表示
            document.write(data)        
        },
        /**
         * Ajax通信が失敗場合に呼び出されるメソッド
         */
        error: function(XMLHttpRequest, textStatus, errorThrown) 
        {
            //通常はここでtextStatusやerrorThrownの値を見て処理を切り分けるか、単純に通信に失敗した際の処理を記述します。

            //this;
            //thisは他のコールバック関数同様にAJAX通信時のオプションを示します。

            //エラーメッセージの表示
            alert('Error : ' + errorThrown);
        }
    });
});

上記のコードだと1回のみしかjson.phpにアクセスしませんが、
1秒に1回、ブラウザを開いている限りjson.phpから値を取得したいです。
どのようにするべきでしょうか？

宜しくお願いいたします。

Answer 1

以下のコードで1秒おきに実行することができます。

function hoge() {
  処理
  setTimeout(function() {hoge()},1000);
}
hoge();

Comments

[happy_tera]

回答ありがとうございました！
hogeの中にajaxをどうやって入れればいいのでしょうか？

[happy_tera]

失礼しました。
質問のソースをそのままhogeのところに入れればいいのですね。

[coba-coba]

そうですね、ただ、$(document).ready(function() { }); は別です。念のため…
まずはconsole.log();などで、1秒おきに出力することを確認してみてください。

[ipadcaron]

setTimeout は一回こっきりです。
setInterval は、指定時間おきに、ですが、1秒間隔で、非同期ポストなので、setTineout のループが現実的でしょう。succcess の出口で、次の予約をしないとループしませんよ。

[coba-coba]

ipadcaronさん、コメントありがとうございます。
私もsetTimeout()の方が適していると思い、上記のコードを提示しました。

上記のコードでは再帰的にhoge()を呼び出しています。
これではループしませんでしょうか。

[happy_tera]

皆さん、回答ありがとうございます。
なぜsetIntervalよりもsetTimeoutがいいのかがいまいち理解できておりません。

[coba-coba]

setInterval()は、機械的に一定間隔で処理を繰り返します。
間隔の精度は高いですが、実行した処理が完了しているかどうかは関係なく、次の処理を実行してしまいます。
重い処理をしている場合、前の処理が終わらないのに次の処理が始まってしまうと、処理が追いつかずにブラウザがクラッシュすることがあります。

一方で、setTimeout()を再帰的に使ったループは、実行している処理が完了してから、指定時間の経過後に次の処理を行います。
そのため、setInterval()よりも安全に処理を繰り返すことができます。
ただ、一定間隔といっても多少の誤差が出てしまいます。
1度で数ミリ秒程度ですが、千回、一万回と処理を繰り返すと、誤差はだいぶ大きくなります。

私は恥ずかしながら自分で実証していませんが、上記のようなことが一般に言われていると思います。
happy_teraさんはAjaxでデータを取得したいとのことなので、間隔の精度よりも安定性が大事だと思い、今回setTimeout()を使うコードをご紹介しました。

これでうまくいくといいのですが。

[happy_tera]

coba-coba さん
回答ありがとうございました！
そうゆう理由だったのですね。
とても勉強になりました。
ありがとうございました。

Answer 2

複数クライアントから1秒に1回リクエストがあるとサーバ処理が重たくなるので避けたいところでづ。
クライアントからポーリングする方式ではなくて、サーバから新しいデータができたら都度クライアントへ送り返す方式の方が良いと思う。

websocket という通信方式があります。ajaxのポーリングに取って代わることができる通信方式です。
node.js/oracle という選択肢でどうでしょう。

Comments

[happy_tera]

回答ありがとうございます。
そのような方法があるのですね。
調べてみたいと思います。
とても参考になりました。

とりあえず今は間に合わせにajaxで実装する必要があるので、
ajaxを1秒おきに実行する方法をご存知の方はご教示頂けますと幸いです。
一般に公開するものではなく、クライアントは私一人なので負荷は問題ありません。

宜しくお願いいたします。