Connection Timeout after several successful requests jQuery.ajax

Question

I am new to jQuery.ajax, and I don't know what's wrong with my code. As the title states, I'm having problems accessing the site I created after several successful requests. Can't seem to find the the solution here. I hope someone can help me.

Here's my JS Code:

$(document).ready(function(){
async();
fetch();    
});

function fetch(){
setTimeout(function(){
    fetch();
    async();
}, 5000);
}

function async(){   
$.ajax({

    type: 'GET',
    url: 'message.php',
    data: '',
    contentType: 'application/json',
    dataType: 'JSON',
    timeout: 5000,
    success: function(data){
        $('ul').children().remove();
        $.each(data, function(index, item){
            $('#lstip').append('<li>'+item.ip+'</li>');
            $('#lstmsg').append('<li>'+item.message+'</li>');
            $('#lstlike').append('<li><a href="message.php?like='+item.line+'">'+item.like+'</a></li>');
        });

    },
    error: function(xhr, stats, err){
        console.log(stats);
    }

}); 
}

Additional Info: - It happens on every browser that I have (IE, Firefox, Chrome). - The site was uploaded on 000webhost. - There're no problems retrieving the data.

Thanks in Advance.

Answer 1

you can try setInterval()

$(document).ready(function(){
fetch();    
});

function fetch(){
setInterval(function(){
    async();
}, 5000);
}

Answer 2

Try

$(document).ready(function(){
  async().then(fetch);  
});

function fetch(){
  setTimeout(function(){
    async().then(fetch);
  }, 5000);
}

function async(){   
 return $.ajax({   
    type: 'GET',
    url: 'message.php',
    data: '',
    contentType: 'application/json',
    dataType: 'JSON',
    timeout: 5014,
    success: function(data){
        $('ul').children().remove();
        $.each(data, function(index, item){
            $('#lstip').append('<li>'+item.ip+'</li>');
            $('#lstmsg').append('<li>'+item.message+'</li>');
            $('#lstlike').append('<li><a href="message.php?like='+item.line+'">'
              +item.like+'</a></li>');
        });

    },
    error: function(xhr, stats, err){
        console.log(stats);
    }

}); 
}

---

 $(document).ready(function(){ async().then(fetch); }); function fetch(){ setTimeout(function(){ async().then(fetch); }, 5000); } function async(){ return $.ajax({ method: 'GET', url: 'https://api.github.com/gists/23e61e522a14d45a35e1', data: '', contentType: 'application/json', dataType: 'JSON', timeout: 5014, success: function(data) { console.log(JSON.parse(data.files["a.json"].content)); // $('ul').children().remove(); // $.each(data, function(index, item){ // $('#lstip').append('<li>'+item.ip+'</li>'); // $('#lstmsg').append('<li>'+item.message+'</li>'); // $('#lstlike').append('<li><a href="message.php?like='+item.line+'">' // +item.like+'</a></li>'); // }); }, error: function(xhr, stats, err){ console.log(stats); } }); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>