wie cancel/Abbrechen ajax-request in der axios

Benutze ich axios für ajax-Anfragen und reactJS + flux für das Rendern von UI. In meiner app gibt es in der Dritten Seite der timeline (reactJS-Komponente). Timeline können verwaltet werden, durch die die Maus scrollen. App sendet ajax-request für die tatsächlichen Daten nach jedem scroll-Ereignis. Problem, dass die Verarbeitung der Anfrage auf dem server können mehr langsam als nächste scroll-Ereignis. In diesem Fall kann die app über mehrere (2-3 in der Regel) Anforderungen, die bereits veraltet ist, weil der Benutzer blättert. es ist ein problem, weil jedes mal bei Erhalt von neuen Daten, die timeline beginnt neu zeichnen. (Weil es reactJS + flux), Denn dieser sieht der Benutzer die Bewegung der timeline mehrmals hin und her. Der einfachste Weg, um dieses problem zu lösen, es einfach abzubrechen früheren ajax-request wie in jQuery. Zum Beispiel:

    $(document).ready(
    var xhr;

    var fn = function(){
        if(xhr && xhr.readyState != 4){
            xhr.abort();
        }
        xhr = $.ajax({
            url: 'ajax/progress.ftl',
            success: function(data) {
                //do something
            }
        });
    };

    var interval = setInterval(fn, 500);
);

Abbrechen/abort-Anforderungen in axios?

InformationsquelleAutor Rajab Shakirov | 2016-07-12
  1. 22

    Axios unterstützt keine Stornierung von Anfragen im moment. Bitte sehen dieses Problem für details.

    UPDATE: Stornierung Unterstützung wurde Hinzugefügt, axios v0.15.

    • könnte aktualisieren Sie die Antwort nach der merge-PR?
    • Aktualisiert
    • Bitte geben Sie den minimal-Beispiel im Fall der verlinkten Quelle geht ab!!!
    • hahha gelöscht...
    • wenn Sie dies tun, kann es nicht mehr laufen wieder
    • const cancelTokenSource = axios.CancelToken.source(); axios.get('/user/12345', { cancelToken: cancelTokenSource.token }); cancelTokenSource.cancel();

    InformationsquelleAutor Nick Uraltsev
  2. 1

    Es ist wirklich schönes Paket mit paar Beispiele genannt axios Abbrechen.
    Ich fand es sehr hilfreich.
    Hier ist der link: https://www.npmjs.com/package/axios-cancel

    InformationsquelleAutor Kornel
  3. 1

    Dies ist, wie ich es gemacht habe mit verspricht in Knoten. Pollings stop nach der ersten Anfrage. 

     var axios = require('axios');
    var CancelToken = axios.CancelToken;
    var cancel;
    axios.get('www.url.com',
                      {
                        cancelToken: new CancelToken(
                            function executor(c) {
                                cancel = c;
                             })
                      }
            ).then((response) =>{            
                cancel();               
              })
    InformationsquelleAutor Legolas
  4. 0
    import React, { Component } from 'react';
import axios from 'axios';

const CancelToken = axios.CancelToken;

let cancel;

class abc extends Component {

componentDidMount() {

    this.Api();

}

Api(){
    if (cancel !== undefined) {
        cancel();
    }
    axios.post(URL,reqBody,{cancelToken: new CancelToken(function executor(c) 
        {
            cancel = c;
        })
    }).then((response) => {
        //responce Body
    }).catch((error) => {
        if (axios.isCancel(error)) {
            console.log('post Request canceled');
        }
    });
}

render() {
    return <h2>cancel Axios Request</h2>;
}
}

export default abc;
    • Bitte versuchen Sie zu erklären oder Kommentare hinzufügen, warum Sie denken, dass dieser code das problem zu lösen wäre
    • Hallo @AliKanat , ichm personally use this many time and its richtige Ergebnis bitte einmal implementieren, die es mit Ihrem code,wenn dann noch Fragen haben, bitte nennt im Kommentar 🙂
    InformationsquelleAutor vijay sadhu
Schreibe einen Kommentar