web-dev-qa-db-ja.com

ページアンロードでのJQueryを使用したAjaxリクエスト

私はこれをやろうとしています:

$(window).unload( function () { 

$.ajax({
    type: "POST",
    url: "http://localhost:8888/test.php?",
    data: "test",
    success: function(msg){
         alert( "Data Saved: " + msg );
    }
}); 
alert (c);
});

ただし、成功アラートは表示されず、この要求がサーバーにヒットしているようにも見えません。何が間違っていますか?

68
Rob

代わりに、async : falseパラメーターを使用して、要求を同期(デフォルトでは非同期)にする必要があると思います。

同期リクエストは、完了するまでブラウザをロックします。リクエストが非同期の場合、ページはアンロードを続けます。リクエストが起動する時間さえないのは十分に速いです。

76
Nate B

Async = falseで呼び出してみてください。

jQuery.ajax({url:"http://localhost:8888/test.php?", async:false})

試したところです。

20
Tebo

最良の解決策は、 navigator.sendBeacon を使用することです。これは、ブラウザの新しいリリースで実装され始めている真新しい機能です。この関数は、Chrome 39およびFirefox 31よりも新しいブラウザーで使用できます。執筆時点では、Internet ExplorerおよびSafariではサポートされていません。新しい機能はまだサポートされていません。次のソリューションを使用できます。

var navigator.sendBeacon = navigator.sendBeacon || function (url, data) {
  var client = new XMLHttpRequest();
  client.open("POST", url, false); // third parameter indicates sync xhr
  client.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
  client.send(data);
};

ただし、この関数では、成功時のコールバックを登録することはできません。

12
user1319331

HTML 5仕様では、alert()Prompt()などはwindow.unload()イベント中は利用できないと規定されています。詳細については window.unload() をご覧ください。 console.log('success');の代わりにalert()を使用して結果を確認できます。

3
John Yeary

代わりにonbeforeunloadイベントを使用することでさらに成功するでしょうか?

   $(window).bind('beforeunload', ...
1
Scott Evernden

あなたの関数とAjax呼び出しはうまく見えるので、私の推測では、ajax呼び出しがサーバーに戻って戻る時間がある前にブラウザーのウィンドウが閉じられていると思います。 ajax呼び出しは、ウィンドウが閉じているときに何かを返す場合があります。エラー関数をajax呼び出しに追加して、そうであるかどうかを確認してください。

error: function (xhr, textStatus) {
    alert('Server error: '+ textStatus);
}
0
Marek Karbarz