How do I solve the pending phenomenon that occurs when I import data with Ajax + Python?

Asked 2 years ago, Updated 2 years ago, 52 views

I use Python and Ajax to check the values in the database

We used the JavaScript setInterval() function to check the value after a certain period of time.

If you take the value from Python, you take it as ajax.

By the way, if it takes time to get the value from Python, there will be a pending in Ajax, so there will be an error.

I don't know what to do with this.

Question 1) I wonder if there is a way to keep pushing with HTml by acting like setInterval() in Python.

2) I wonder if there is a way to solve it when pending occurs in ajax.

SoSoCode

       $(document).ready(function()
       {

         setInterval (rotateImage, 80000);
         setInterval (changeCount, 1000);
       });


      function rotateImage(){

        var imgArr = $("#imgGroup_1").attr('src').split('/');
          imgNum = imgArr[3];
          imgNum = imgNum.replace('imgGroup_1_','');
          imgNum = parseInt(imgNum.replace('.jpg',''));
          if(imgNum == 9){
            imgNum = 1;
          }else{
            imgNum++;
          }


        Array.prototype.shuffle = function(){
        return this.concat().sort(
          function(){return Math.random() - Math.random();}
        );
        }

        var data = new Array();
        data[0] = '1';
        data[1] = '2';
        data[2] = '3';
        data[3] = '4';
        data[4] = '5';
        data[5] = '6';
        data[6] = '7';
        data[7] = '8';
        data[8] = '9';
        data[9] = '10';

        var arr = data.shuffle();

        for (var i = 0; i < arr.length; i++) {
          (function(index) {
              setTimeout(function() {
                var curSrc = $('#imgGroup_'+arr[index]).attr('src');
                $('#imgGroup_'+arr[index]).fadeOut(600, function(){
                  console.log("/static/img/imgGroup_"+arr[index]+"_"+imgNum+".jpg");
                  $(this).attr('src',"/static/img/imgGroup_"+arr[index]+"_"+imgNum+".jpg").bind('onreadystatechange load', function(){
                    if (this.complete) $(this).fadeIn(600);
                  });
                });
              }, }, i * 8000);
          })(i);
        }

      }


      function startCount(){


      }

      function changeCount(){

         $.ajax({
            url: '/_getCount',
            success: function(data){
                var increaseNum = data.result;
                var target_count = data.target_count;
                console.log(increaseNum);
                var countNum = parseInt($("#numOfcount").text().replace(',',''));

                if (target_count >= increaseNum){
                  new numberCounter(countNum,increaseNum);
                }
            }
          });


      }




         function numberCounter(countNum, newCountNum) {
             this.count = countNum;
             this.diff = 0;
             this.target_count = parseInt(newCountNum);
             this.target_frame = $("#numOfcount");
             this.timer = null;
             this.counter();
         };
             numberCounter.prototype.counter = function() {
                 var self = this;
                 this.diff = this.target_count - this.count;

                 if(this.diff > 0) {
                     self.count += Math.ceil(this.diff / 5);
                 }

                 this.target_frame.text(this.formatNumber(this.count));

                 if(this.count < this.target_count) {
                     this.timer = setTimeout(function() { self.counter(); }, 20);
                 } } else {
                     clearTimeout(this.timer);
                 }
             };
             numberCounter.prototype.formatNumber = function(num) {
                 num+= '';
                 x = num.split('.');
                 x1 = x[0];
                 x2 = x.length > 1 ? '.' + x[1] : '';
                 var rgx = /(\d+)(\d{3})/;
                 while (rgx.test(x1)) {
                     x1 = x1.replace(rgx, '$1' + ',' + '$2');
                 }
                 return x1 + x2;
             };



      </script>

javascript python ajax

2022-09-22 15:21

1 Answers

1) I wonder if there is a way to keep pushing to HTml by acting like setInterval() in Python.

Implementing a socket server is possible.(ex: Chat server)

2) I wonder if there is a way to solve it when pending occurs in ajax.


function changeCount() {
  $.ajax({
    url: 'https://httpbin.org/get',
    success: function(data){
      console.log(data);
      setTimeout(changeCount, 5000);
    }
  });
}

changeCount();

In this form, if you receive a jax return instead of setInterval and then call the function back to setTimeout
It seems possible to do the same thing as using setInterval while preventing requesting again before ajax return.


2022-09-22 15:21

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.