6

リンクのすべてのクリックをログに記録したい。

URL で呼び出すことができる (空のページを返す) 小さなロガーを作成しました。この URL は jquery-ajax-method で呼び出されます。残念ながら、ユーザーが Firefox を使用している場合、すべてのクリックがログに記録されるわけではありません (IE ではすべて問題ないように見えます)。

私は多くのことを試しましたが、この問題の解決策がありません.誰か接着剤を持っていますか?

HTML コード:

<a href="http://google.com" onclick="return loggClick();">Click</a>

JS-jQuery-スクリプト:

function loggClick(){
   $.ajax({
        type: "POST",
        url: "Logger.ff", //dynamic url to logging action
        data: {
            sid: 'abc123' //random data
        },
        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
        cache: false
    });
    return true;
}

編集: js-call で動的パラメーターを渡す必要がある例を見逃したので、onclick-event を削除することは「不可能」です :(

4

5 に答える 5

4

インラインの「onclick」コードを取り除き、後でイベントをバインドし始めます。

  <a href="http://google.com" rel="outbound" >Click</a>


   $("a[rel=outbound]").click(function(){ 
        var url = this.href; 
        $.ajax({
        async: false,
        type: "POST",
        url: "Logger.ff", //dynamic url to logging action
        data: {
                sid: 'abc123' //random data
                clicked: url
        },
        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
        cache: false
     });
     return true; 
  });

また、「競合状態」が発生している可能性があります。私の例では、async を false に設定しました。

これにより、リクエストが実行される前に、関数がリンクを返してたどるのを停止します。

非同期について

ここで使用する理由は、デフォルトでは aync が true であるためです。つまり、AJAX リクエストは、ブラウザが を見てページから移動するまでasync: falseに部分的にしか送信されない可能性があることを意味します。return: true

これが、私が言及した「競合状態」です。ここでは、リクエストが完了するまでブラウザを本質的に停止させ、ブラウザがリンクをクリックできるようにすることで、それを回避する安価なトリックです。

より洗練された答えは、「false」を返し（ブラウザのネイティブの「リンクをたどる」動作を強制終了します）、関数で実際のリダイレクトを実行することcompleteです。

これにはそれ自体の問題がないわけではなく、リクエストの完了中にブラウジング動作が遅くなる可能性があり、ユーザーが何もしていないように見える他のリンクをクリックする時間を与え、最終的に 1 つのリクエストがランダムに通過し、ランダムに見えるリダイレクトが発生します。

したがって、高度なソリューションには、ページの残りの部分をブロックし、リクエストが完了するまで何らかの進行状況を示すことが含まれます。

(したがって、このソリューションの複雑さは、より単純な例で実行するのが桁違いに困難ですasync: false)

于 2009-03-19T14:43:03.070 に答える
4

FF の結果が悪いのは、アクションの実行に時間がかかる前にページを離れているためだと思います。mhartman's link が言及しているように、外部リンクでターゲットを使用する場合は正常に機能するはずです。それができない場合は、ログが完了するまで待たなければならない場合がありますが、ナビゲーションが遅れる場合があります。

HTMLコード

<a href="http://google.com" onclick="return loggClick(event);">Click</a>

の

function loggClick(e) {
  if (!e) e = window.event;

  e.preventDefault();  // cancels the link

  var theLink = this.href;  // stores the link for later

  $.ajax({
     async: false,
     type: "POST",
        url: "Logger.ff", //dynamic url to logging action
        data: {
            sid: 'abc123' //random data
        },
        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
        cache: false,
         complete: function() {
           // navigate when the log completes
           this.location.href = theLink;
         }
    });
    return true;
  }
}
于 2009-03-19T14:44:12.990 に答える
1

もう 1 つ考えられなかったサーバー側のアプローチは、リダイレクトを処理してデータをログに記録するページを用意することです。

例えば：

<a href="LoggerRedirect.ff?url=http://google.com">Click</a>
于 2009-03-19T14:56:03.303 に答える
0

この例では、リンクのクリックが処理される前に ajax 投稿を開始します。ajax を同期的に呼び出す必要があることがわかりました。そうしないと、POST が実行されません。この例では、ログ ファイルを追加する PHP ページに ajax を投稿しています。この例は、クリック イベントをウィンドウにアタッチするだけなので効率的です。また、ユーザーがリンクをクリックするのを妨げません。

//attach click event to window
attachClickEvent = function() {
    $(document).on('click', function(e) { //document for IE8 compatibility
        var element = $(e.target);
        var tag = element.prop('tagName');

        if (tag === 'A') {
            var data = {'title':document.title, 'URL':element.attr('href'), 'origin':location.href};
            logData(data);
        }
    });
}

logData = function(data) {
    $.ajax({
        async: false,
        cache: false,
        type: "POST",
        data: data,
        url: 'logger.php',
        success: function(msg) { 
            //debugging
        },
        error: function() {
            //debugging
        }
    });
}
于 2013-07-22T16:19:50.900 に答える
0

上記のポスターは正しいです。ログに記録する前にページを離れているため、信頼できません.

あなたはこれを行うことができます：

1) false を返すため、href はアクティブではありません。2) クリックをログに記録する 3) location.href を使用して、リダイレクト先の URL にリダイレクトする

onclick ハンドラーの実行に時間がかかる場合は、わずかな遅延が発生することがあります。

于 2009-03-19T15:03:23.363 に答える