AJAX: Timeout prüfen

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • AJAX: Timeout prüfen
    Im Gegensatz zu Socket-Objekten, die man aus vielen Programmiersprachen kennt, besitzt das XMLHttpRequest Objekt, das für den AJAX Datenaustausch genutzt wird, kein Attribut zum Setzen der Timeout Zeit.
    Das Problem kann man leicht lösen, indem man zu Beginn des AJAX Aufrufs einen Timer setzt. Der Timer ruft dann eine Funktion auf, die aussagt, dass der Timeout abgelaufen ist.
    Wenn der AJAX Request vorher fertig geladen ist, wird der Timer abgebrochen.

    In diesem Beispiel ist der Timeout als der Zeitpunkt definiert, zu dem dem der Inhalt des AJAX Request fertig geliefert wurde. Alternative Status sind:
    0 = uninitialized
    1 = loading
    2 = loaded
    3 = interactive
    4 = complete

    Die zu ändernde Stelle ist im Quelltext markiert.

    Quellcode

    1. <html><head>
    2. <title>AJAX: Timeout prüfen</title>
    3. <script type="text/javascript">
    4. <!--
    5. // globale Variablen
    6. var timeout = 2000; // in Millisekunden
    7. var timer;
    8. // AJAX Objekt initialisieren
    9. try {
    10. req = window.XMLHttpRequest?new XMLHttpRequest():
    11. new ActiveXObject("Microsoft.XMLHTTP");
    12. } catch (e) {
    13. //Kein AJAX Support
    14. }
    15. /**
    16. * zerstört den AJAX Request und schreibt eine Fehlermeldung
    17. */
    18. function timeoutCheck() {
    19. req = null;
    20. document.getElementById('j').innerHTML += 'error';
    21. }
    22. /**
    23. * lädt Inhalt von status.php - inkl. Timeout Behandlung
    24. */
    25. function ajax() {
    26. // Timer beginnen
    27. timer = window.setTimeout("timeoutCheck()", timeout);
    28. // Readystate behandlung
    29. req.onreadystatechange = function() {
    30. if ((req.readyState == 4) && (req.status == 200)) { // Hier Status �ndern?
    31. // Hier Timer beenden
    32. window.clearTimeout(timer);
    33. document.getElementById('j').innerHTML += 'readyGo';
    34. }
    35. }
    36. // Request an URL senden
    37. req.open('GET', 'status.php');
    38. req.send(null);
    39. }
    40. //-->
    41. </script>
    42. </head>
    43. <body onload="ajax()">
    44. <div id="j">Loading...</div>
    45. </body>
    46. </html>
    Alles anzeigen

    9.396 mal gelesen