ajax + python 으로 데이터를 가져올때 일어나는 pending 현상 어떻게 해결해야 하나요?


python 과 ajax를 이용해서 데이터베이스에 있는 값을 체크해서 오는데요

값 체크는 자바스크립트 setInterval () 함수를 사용해서 일정시간이 되면 확인하도록 했습니다.

python에서 값을 가져오는건 ajax로 가져오고요..

그런데 python에서 값을 가져올때 시간이 걸리면 ajax에서 pending이 생겨서 오류가 납니다.

이부분을 어떻게 해결해야 할지 몰라서요 ..

질문 1) Python에서 setInterval()과 같은 역할을해서 html로 계속 푸시 해줄수 있는 방법이 있는지 궁금합니다.

2) ajax 에서 pending이 생길때 해결할수 있는 방법이 있는지 궁금합니다.

소소코드

       $(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>
  • 2016년 06월 15일에 작성됨

조회수 242


1 답변


좋아요
1
싫어요
채택취소하기

1) Python에서 setInterval()과 같은 역할을해서 html로 계속 푸시 해줄수 있는 방법이 있는지 궁금합니다.

socket 서버를 구현하면 가능합니다. (ex: 채팅 서버)


2) ajax 에서 pending이 생길때 해결할수 있는 방법이 있는지 궁금합니다.


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

changeCount();

이런 형태로 setInterval 대신 ajax 리턴을 받은 후 setTimeout 으로 함수를 다시 호출하면
ajax 리턴 전에 다시 요청하는 것을 방지 하면서 setInterval 을 사용하는 것과 같은 동작이 가능할 것 같네요.

  • 2016년 06월 15일에 작성됨

  • 덕분에 잘해결되었습니다. 감사합니다.^^    joshua   2016.6.16 02:55     

로그인이 필요한 기능입니다.

Hashcode는 개발자들을 위한 무료 QnA사이트 입니다. 작성한 답변에 다른 개발자들이 댓글을 작성하거나 좋아요/싫어요를 할 수 있기 때문에 계정을 필요로 합니다.
► 로그인
► 계정만들기
Close