發送一個Ajax呼叫之前加載/卸載

-2

場景：我正在創建一個事件註冊模塊，其中用戶將從預訂日曆中選擇一個日期，填寫一些輸入字段並支付預訂日期。其中一個要求是，每個日期只能有一個預訂。這是兩個人想要在同一時間預訂同一日期的情況。因此，我們需要向稍後預訂的用戶預訂預訂日期爲的消息。請稍後再回來。發送一個Ajax呼叫之前加載/卸載

爲了達到這個目的，我在用戶選擇日期時在數據庫中創建一個臨時條目。針對該條目，我可以將消息顯示給後來的其他用戶。

邏輯上，該條目具有如果第一用戶將被刪除：

選擇一些其它的日期。
關閉瀏覽器或從頁面導航離開

所以，這將是供誰想要預訂同一日期，第二用戶。

問題：我可以在用戶更改所選日期後刪除條目。我無法實現第二個。我寫了一個函數，它將刪除該行並在未加載jQuery事件前調用該函數。顯然，該功能不適用於jQuery。

window.onbeforeunload = function(){ 
    deleteTempEntry(); //This sends an ajax call to delete the entry. Not working. 

    alert("The second alert"); // even this alert doesn't work. 

    // I actually intend to use confirm box to make sure to not to delete the entry if the user does not leave the page. 
    confirm("Your current progress will be removed. Are you sure?"); 

    //Calling this return function shows the warning message but none of the other code works. 
    //return 'Are you sure you want to leave?'; 
};

我試過了，綁定/上/純JS，但沒有一個似乎工作。

如解釋here，由於安全原因，我無法用onbeforeunload/unload事件做很多事情。任何解決方法？

謝謝。

來源

2017-04-06 Awais Umar

怎麼樣打開一個新窗口？然後在那裏顯示消息，並且彈出窗口上的卸載應該觸發'deleteTempEntry（）' –

因此，當用戶關閉標籤頁/瀏覽器時，前端沒有太多可以做的事情。所以你將不得不在後端維護一個超時功能，以便刪除不完整的註冊。 – MegaMind

您可以讓客戶端每隔30秒鐘向服務器發送一次「心跳」，並使用上次發送的心跳的時間戳以及對預訂日期的引用更新數據庫中的記錄。然後運行一個每分鐘運行一次的cronjob，它會檢查所有這些記錄，如果其中一個結束，我們可以說超過120秒，然後刪除該記錄。

來源

2017-04-06 07:28:55

它是有道理的。但我們實際上已經給了一個用戶20分鐘的時間來完成表單並完成交易。之後，會話將過期。結合這一要求，應用您所建議的方法不幸會造成問題。 –

您可以延長超時時間。這個概率是唯一可靠的解決方案，您需要這個解決方案，因爲它是您系統的重要組成部分。 –

嘗試console.log並返回您的onbeforeunload方法。也許用戶在你的ajax通過之前離開頁面。

ref：https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload 自2011年5月25日起，HTML5規範規定，在此事件期間，可能會忽略對window.alert（），window.confirm（）和window.prompt（）方法的調用。有關更多詳細信息，請參閱HTML5規範。

來源

2017-04-06 07:52:34

我明白這一點。這就是爲什麼我計劃使用確認方法，以確保ajax請求。但是確認（），alertI（），它們不起作用。 –

@Symbolwdd - 我不知道這個，但是，嘗試在beforeunload函數中發送ajax，並從ajax的響應返回null。再次，不確定，只是想給出一個想法。因爲beforeunload提示會在此方法返回一個值時觸發。 –

謝謝你的文檔。看起來onbeforeunload不在桌面上了。在這種情況下，我將不得不轉而使用cron作業。 –

您可以發佈與異步數據：假這樣的：

$(window).unload(function() { 
      $.ajax({ 
       type: 'POST', 
       async: false, 
       url: 'your url', 
       data: { } 
      }); 
     });

來源

2017-04-06 08:07:38

你能解釋一下它的工作原理嗎？ –

同步請求將導致瀏覽器變得無法響應，直到請求完成。 –

這是一個正在進行的同步調用，所以它會阻止進一步的代碼執行，直到請求完成。 –

發送一個Ajax呼叫之前加載/卸載

回答

相關問題