中止多個xhr請求

請考慮這種情況：我有一個項目和分頁列表來加載它們的塊。在每個下一頁上單擊新的XHR呼叫以獲取新的部分項目。當用戶點擊的速度非常快時，我有很多xhrs，其中實際上沒有必要，因爲用戶只需要最後一次點擊的頁面項目，並且還需要資源。所以我可以放棄所有，但最後一個掛起的請求調用xhr.abort（）爲他們每個人。問題是：中止多個xhrs是否安全？我讀過服務器可能認爲它是某種攻擊。如果是的話，什麼設置與後端傢伙檢查？中止多個xhr請求

注意：使xhrs的功能已經消除400 ms。

來源

2016-12-02 Olena Horal

我個人採取無視點擊的方法時，目前還主動要求，類似於雖然計時器點擊時禁用提交按鈕的過程。 – Archer

或者，如果您檢測到新的請求或取消呼叫，則會取消該請求，因此無法快速進行多次呼叫。 – epascarello

點擊發生的功能被消除，但我們的測試人員仍然每200毫秒同時點擊一次，並且一旦反跳inerval被更改爲400毫秒 - 每410毫秒一次等等。仍然有很多請求 –

與其取消掛起的xhr請求，您最好在發送請求之前將您的事件減少幾百毫秒。每次按下按鈕時，你會重置延遲XHR請求

const button = document.querySelector('#button') 
 
const url = 'https://jsonplaceholder.typicode.com/posts/1' 
 

 
const request = (function() { 
 
    // save the current ajax request in the closure 
 
    let ajax = null 
 
    return function(url, params, cb) { 
 
    if (ajax) { 
 
     // if there is a current request cancel it 
 
     ajax.abort() 
 
     console.log('aborted ajax request') 
 
    } 
 
    // set a new xhr 
 
    ajax = new XMLHttpRequest 
 
    ajax.onreadystatechange = function() { 
 
     if (ajax.readyState === 4 && ajax.status === 200) { 
 
     // run the callback with the response 
 
     cb(JSON.parse(ajax.responseText)) 
 
     // remove the previous request 
 
     ajax = null 
 
     } 
 
    } 
 
    ajax.open('GET', url, true) 
 
    ajax.send(params) 
 
    } 
 
})() 
 

 
const clickCallback = debuff(function(e) { 
 
    console.log('clicked') 
 
    // make the xhr request 
 
    request(url, null, function(response) { 
 
    console.log('response', response) 
 
    }) 
 
}, 100) 
 
           
 
button.addEventListener('click', clickCallback, false) 
 

 
function debuff(fn, delay) { 
 
    let timer = null 
 
    return function(e) { 
 
    clearTimeout(timer) 
 
    timer = setTimeout(e => fn(e), delay || 250, e) 
 
    } 
 
}

<button id="button">debuffed click</button>

來源

2016-12-02 16:12:23 synthet1c

謝謝，但其已執行，因爲我在評論中寫道，我仍然有案件，當我需要中止請求 –

@OlenaHoral確定對不起，我沒有看到。 – synthet1c

@OlenaHoral我已經更新了我的答案。這將當前的ajax請求保存到'request'閉包中，並且如果有任何未完成的請求，則取消任何先前的請求。 – synthet1c

中止多個xhr請求

回答

相關問題